Subscriptions (Plans) Management
This page is used to manage Subscriptions — here you can manage the plans or subscription tiers for your application
.
On this page you can:
- Create a new plan
- Edit an existing plan
- Pause or Unpause a plan
- Delete a plan (the Default plan cannot be deleted)
- Search or filter plans (both on Desktop and Mobile)
- Use quick actions through a right-click context menu
At the top of the page you will see the heading:
Subscriptions
Manage plans for
2) Controls (Search + Create Plan)
Search Plans
At the top you will see a search input:
Search plans...
This search works as a live filter:
- As you type, only matching plans appear in the list
- Both Desktop and Mobile rows are filtered (class: .sub-row)
On the right side you will see the button:
+ Create Plan
Clicking this button opens the New Plan modal.
If a session message is set:
- toast.php is included
- A success toast notification is displayed
- The session message is then cleared
4) Desktop View (Plans List)
In desktop view, the list header shows the following columns:
- Plan Name
- Level
- Status
- Action
If No Application Is Selected
If $selected_app is 0, the following message appears:
Please select an application.
If No Plans Exist
If the subscriptions list is empty, the message will be:
No plans found. Create one to get started!
Plan Row Details
Each plan row displays the following information:
- Plan Name (bold)
- Level (example: Level 5)
- Status:
- Active → green badge
- Paused → yellow/orange badge
At the end of each row there is a 3-dots dropdown menu with several actions.
Edit
Clicking Edit will:
- Open the Edit Plan modal
- Automatically fill the id, name, and level fields
Pause / Unpause
If the plan status is active, the button will display:
Pause
If the plan status is paused, the button will display:
Unpause
This action sends a POST request with:
- sub_id
- action_submit = 1
- action_name = pause / unpause
Delete (Not Allowed for Default Plan)
The delete option appears only if the plan name is not default.
Clicking delete will show a confirmation popup:
Delete this subscription?
After confirmation, a POST request is sent with:
6) Mobile View
On mobile devices, each plan appears as a card layout:
- Plan name
- Level
- Status (Active / Paused)
- 3-dots menu for Edit / Pause / Delete
The same rules apply on mobile:
- The default plan cannot be deleted
- Pause / Unpause follows the same logic
7) Create Plan Modal (New Plan)
Clicking the Create Plan button opens a modal:
New Plan
Fields
- Plan Name (example: VIP)
- Level (range 1–100, default 1)
Buttons:
- Cancel
- Create Plan (submit: name="create_subscription")
A hidden field sends the current application ID:
app_id =
8) Edit Plan Modal
Clicking Edit opens the modal:
Edit Plan
- action_submit = 1
- action_name = edit
- sub_id (auto filled)
Fields
Buttons:
9) Search Filter (JavaScript)
The search input (searchBox) listens for the keyup event:
- The search text is converted to lowercase
- Each row's data-name attribute is compared
- If it does not match → the row is hidden
- If it matches → the row is shown
This applies to both desktop and mobile rows because both use the class .sub-row.
On both desktop and mobile, right-clicking a row opens a custom context menu.
- Edit
- Pause (if active)
- Unpause (if paused)
- Delete (if not the default plan)
Default Plan Safety
If the plan name is default:
- The delete option will not appear in the context menu
- The dropdown menu also blocks deletion
The menu closes when:
- You click anywhere on the page
- A right-click occurs outside of a sub-row
11) submitAction() (Pause / Unpause / Delete)
Context menu actions send a POST request using a hidden form:
- sub_id
- action_submit = 1
- action_name = edit / pause / unpause / delete
If the action is delete, a confirmation prompt appears:
Are you sure you want to delete this subscription?