chore: Static URL Support for Applications and Pages (#41312)

## 🎯 Overview
This PR implements **Static URL** functionality for Appsmith
applications and pages, allowing users to create clean, URLs without
auto-generated IDs. This feature is gated behind the
`release_static_url_enabled` feature flag.

## 🚀 Key Features

### 1. **Application-Level Static URLs**
- **Enable/Disable Static URLs**: Toggle static URLs on/off at the
application level
- **Custom Application Slug**: Set a unique, human-readable slug for the
entire application (e.g., `my-app` instead of `untitled-application-5`)
- **Real-time Validation**: Client-side and server-side validation for
slug format (lowercase letters, numbers, hyphens only)
- **Availability Check**: Real-time checking if a slug is available or
already taken
- **Slug Suggestions**: Auto-generate slug suggestions based on
application name

### 2. **Page-Level Static URLs**
- **Custom Page Slugs**: Set unique slugs for individual pages (e.g.,
`dashboard` instead of `page1-68fb0a086001f8101c93e34q`)
- **Per-Page Configuration**: Each page can have its own static slug
- **Validation & Uniqueness**: Real-time validation and uniqueness
checking for page slugs

### 3. **URL Format Changes**
**Before (Legacy Format):**
```
/app/application-slug/page-name-<pageId>
```

**After (Static URL Format):**
```
/app/app-slug/page-slug
```

## 🏗️ Technical Implementation

### **New Routes**
- `BUILDER_PATH_STATIC`:
`/app/:staticApplicationSlug/:staticPageSlug/edit`
- `VIEWER_PATH_STATIC`: `/app/:staticApplicationSlug/:staticPageSlug`

### **New Redux Actions**
- `ENABLE_STATIC_URL` / `DISABLE_STATIC_URL`: Toggle static URL feature
- `PERSIST_APP_SLUG` / `PERSIST_PAGE_SLUG`: Save application/page slugs
- `VALIDATE_APP_SLUG` / `VALIDATE_PAGE_SLUG`: Validate slug availability
- `FETCH_APP_SLUG_SUGGESTION`: Get auto-generated suggestions

### **New API Endpoints**

#### Application APIs
- `POST /api/v1/applications/:applicationId/static-url` - Enable static
URL with initial slug
- `PUT /api/v1/applications/:applicationId/static-url` - Update
application slug
- `DELETE /api/v1/applications/:applicationId/static-url` - Disable
static URL
- `GET /api/v1/applications/:applicationId/static-url/:uniqueSlug` -
Validate application slug availability
- `GET /api/v1/applications/:applicationId/static-url/suggest-app-slug`
- Get slug suggestion

#### Page APIs
- `PATCH /api/v1/pages/static-url` - Update page slug
- `GET /api/v1/pages/:pageId/static-url/verify/:uniqueSlug` - Validate
page slug availability

### **URL Assembly Enhancements**
- Extended `URLAssembly` to support static URL generation
- Added `URL_TYPE.STATIC` for static URL routing
- Static URLs only apply in **published/viewer mode** (edit mode uses
regular URLs)
- Automatic fallback: If `staticPageSlug` is not set, falls back to
regular `pageSlug`

## 🎨 UI Components

### **General Settings (Application Level)**
- **Static URL Toggle**: Enable/disable static URLs for the application
- **Application Slug Input**: 
  - Real-time validation with error messages
  - Loading states during validation
  - Success/error indicators
  - URL preview showing the final URL
- **Apply/Cancel Buttons**: Persist or discard changes
- **Confirmation Modal**: Shows before/after URLs when changing or
disabling

### **Page Settings (Page Level)**
- **Page Slug Input**: Similar to application slug with validation
- **URL Preview**: Shows the complete page URL
- **Apply/Cancel Actions**: Per-page slug management

### **StaticURLConfirmationModal**
- Displays "From" and "To" URLs
- Warning message about breaking existing links
- Different modes: "Change" vs "Disable"
- Bold formatting for app/page slugs in URLs

## 🔄 State Management

### **Application Reducer**
- `uniqueSlug`: Stores the application's static slug
- `staticUrlEnabled`: Boolean flag for static URL status

### **Page List Reducer**
- `uniqueSlug`: Stores each page's static slug
- Updates only the specific page when slug is persisted

### **Applications UI Reducer**
- `isValidatingAppSlug`: Validation in progress
- `isApplicationSlugValid`: Validation result
- `isFetchingAppSlugSuggestion`: Fetching suggestion
- `appSlugSuggestion`: Auto-generated suggestion
- `isPersistingAppSlug`: Save in progress

## 🛡️ Validation Rules

**Application/Page Slug Requirements:**
- Only lowercase letters (a-z)
- Numbers (0-9)
- Hyphens (-)
- No spaces or special characters
- Must be unique across the workspace
- Cannot be empty

## 🔀 Navigation & Routing

### **Route Matching Updates**
- Extended `matchBuilderPath` to include `BUILDER_PATH_STATIC`
- Extended `matchViewerPath` to include `VIEWER_PATH_STATIC`
- Updated route params to include optional `staticApplicationSlug` and
`staticPageSlug`

### **Page Navigation**
- New hook: `useStaticUrlGeneration` for generating static URLs in
navigation
- Updated `useNavigateToAnotherPage` to support static URLs
- Menu items and navigation components updated to use static URLs when
available

## 📦 Key Files Changed

**Core Logic:**
- `URLAssembly.ts`: URL generation logic with static URL support
- `ApplicationSagas.tsx`: Sagas for enable/disable/persist operations
- `PageSagas.tsx`: Page-level slug persistence
- `appRoutes.ts`: New static URL routes

**UI Components:**
- `GeneralSettings.tsx`: Application-level static URL configuration
- `PageSettings.tsx`: Page-level static URL configuration
- `StaticURLConfirmationModal.tsx`: Confirmation dialog (new)
- `UrlPreview.tsx`: URL preview component (new)

**State Management:**
- `applicationsReducer.tsx`: Application UI state
- `appReducer.ts`: Application entity state
- `pageListReducer.tsx`: Page list state

## ⚙️ Feature Flag
- `release_static_url_enabled`: Controls visibility of static URL
features

## Automation

/ok-to-test tags="@tag.All"

### 🔍 Cypress test results
<!-- This is an auto-generated comment: Cypress test results  -->
> [!TIP]
> 🟢 🟢 🟢 All cypress tests have passed! 🎉 🎉 🎉
> Workflow run:
<https://github.com/appsmithorg/appsmith/actions/runs/18936467359>
> Commit: a74b4ac
> <a
href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=18936467359&attempt=1"
target="_blank">Cypress dashboard</a>.
> Tags: `@tag.All`
> Spec:
> <hr>Thu, 30 Oct 2025 10:56:15 UTC
<!-- end of auto-generated comment: Cypress test results  -->


## Communication
Should the DevRel and Marketing teams inform users about this change?
- [ ] Yes
- [ ] No


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **New Features**
* Static URL support for apps and pages: enable/disable static URLs,
edit app/page slugs, validate and persist slugs, and receive slug
suggestions.
* URL preview with click-to-copy and a confirmation modal when changing
or disabling app slugs.

* **Bug Fixes / Improvements**
  * Routing, editor and viewer flows updated for slug-based paths.
* Base page resolution and editor links now derive from application
state for more reliable navigation and loading.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Pedro Santos Rodrigues <pedro@appsmith.com>

Author: ashit-rath

app/client/src/PluginActionEditor/components/PluginActionResponse/components/BindDataButton.tsx

@@ -17,6 +17,7 @@ import {
 import { useDispatch, useSelector } from "react-redux";
 import {
   getCurrentApplicationId,
+  getCurrentBasePageId,
   getPageList,
   getPagePermissions,
 } from "selectors/editorSelectors";
@@ -247,11 +248,11 @@ function BindDataButton(props: BindDataButtonProps) {
   const pagePermissions = useSelector(getPagePermissions);
 
   const params = useParams<{
-    basePageId: string;
     baseApiId?: string;
     baseQueryId?: string;
     moduleInstanceId?: string;
   }>();
+  const currentBasePageId = useSelector(getCurrentBasePageId);
 
   const isFeatureEnabled = useFeatureFlag(FEATURE_FLAG.license_gac_enabled);
 
@@ -346,7 +347,7 @@ function BindDataButton(props: BindDataButtonProps) {
           params.baseQueryId ||
           params.moduleInstanceId) as string,
         applicationId: applicationId as string,
-        basePageId: params.basePageId,
+        basePageId: currentBasePageId,
       }),
     );
 

app/client/src/actions/initActions.ts

@@ -14,6 +14,8 @@ export interface InitEditorActionPayload {
   branch?: string;
   mode: APP_MODE;
   shouldInitialiseUserDetails?: boolean;
+  staticApplicationSlug?: string;
+  staticPageSlug?: string;
 }
 
 export const initEditorAction = (
@@ -26,9 +28,11 @@ export const initEditorAction = (
 export interface InitAppViewerPayload {
   branch: string;
   baseApplicationId?: string;
-  basePageId: string;
+  basePageId?: string;
   mode: APP_MODE;
   shouldInitialiseUserDetails?: boolean;
+  staticApplicationSlug?: string;
+  staticPageSlug?: string;
 }
 
 export const initAppViewerAction = ({
@@ -37,6 +41,8 @@ export const initAppViewerAction = ({
   branch,
   mode,
   shouldInitialiseUserDetails,
+  staticApplicationSlug,
+  staticPageSlug,
 }: InitAppViewerPayload) => ({
   type: ReduxActionTypes.INITIALIZE_PAGE_VIEWER,
   payload: {
@@ -45,6 +51,8 @@ export const initAppViewerAction = ({
     basePageId,
     mode,
     shouldInitialiseUserDetails,
+    staticApplicationSlug,
+    staticPageSlug,
   },
 });
 

app/client/src/actions/pageActions.tsx

@@ -705,3 +705,23 @@ export const navigateToAnotherPage = (
   type: ReduxActionTypes.NAVIGATE_TO_ANOTHER_PAGE,
   payload,
 });
+
+export const persistPageSlug = (pageId: string, slug: string) => {
+  return {
+    type: ReduxActionTypes.PERSIST_PAGE_SLUG,
+    payload: {
+      pageId,
+      slug,
+    },
+  };
+};
+
+export const validatePageSlug = (pageId: string, slug: string) => {
+  return {
+    type: ReduxActionTypes.VALIDATE_PAGE_SLUG,
+    payload: {
+      pageId,
+      slug,
+    },
+  };
+};

app/client/src/api/PageApi.tsx

@@ -89,6 +89,7 @@ export interface UpdatePageRequest {
   name?: string;
   isHidden?: boolean;
   customSlug?: string;
+  uniqueSlug?: string;
 }
 
 export interface UpdatePageResponse {
@@ -97,6 +98,7 @@ export interface UpdatePageResponse {
   name: string;
   slug: string;
   customSlug?: string;
+  uniqueSlug?: string;
   applicationId: string;
   layouts: Array<PageLayout>;
   isHidden: boolean;
@@ -300,6 +302,20 @@ class PageApi extends Api {
   ): Promise<AxiosPromise<FetchApplicationResponse>> {
     return Api.get(PageApi.url, params);
   }
+
+  static async persistPageSlug(request: {
+    branchedPageId: string;
+    uniquePageSlug: string;
+  }): Promise<AxiosPromise<ApiResponse>> {
+    return Api.patch(`${PageApi.url}/static-url`, request);
+  }
+
+  static async validatePageSlug(
+    pageId: string,
+    uniqueSlug: string,
+  ): Promise<AxiosPromise<ApiResponse>> {
+    return Api.get(`${PageApi.url}/${pageId}/static-url/verify/${uniqueSlug}`);
+  }
 }
 
 export default PageApi;

app/client/src/api/services/ConsolidatedPageLoadApi/types.ts

@@ -2,4 +2,6 @@ export interface ConsolidatedApiParams {
   applicationId?: string;
   defaultPageId?: string;
   branchName?: string;
+  staticApplicationSlug?: string;
+  staticPageSlug?: string;
 }

app/client/src/ce/AppRouter.tsx

@@ -14,6 +14,7 @@ import {
   BUILDER_PATCH_PATH,
   BUILDER_PATH,
   BUILDER_PATH_DEPRECATED,
+  BUILDER_PATH_STATIC,
   CUSTOM_WIDGETS_DEPRECATED_EDITOR_ID_PATH,
   CUSTOM_WIDGETS_EDITOR_ID_PATH,
   CUSTOM_WIDGETS_EDITOR_ID_PATH_CUSTOM,
@@ -27,6 +28,7 @@ import {
   VIEWER_PATCH_PATH,
   VIEWER_PATH,
   VIEWER_PATH_DEPRECATED,
+  VIEWER_PATH_STATIC,
   WORKSPACE_URL,
 } from "constants/routes";
 import WorkspaceLoader from "pages/workspace/loader";
@@ -135,6 +137,9 @@ export function Routes() {
       {/*
        * End Note: When making changes to the order of the paths above
        */}
+      {/* Static URL routes that accept any page slug - must be after more specific routes */}
+      <SentryRoute component={AppIDE} path={BUILDER_PATH_STATIC} />
+      <SentryRoute component={AppViewerLoader} path={VIEWER_PATH_STATIC} />
       <Redirect from={BUILDER_PATCH_PATH} to={BUILDER_PATH} />
       <Redirect from={VIEWER_PATCH_PATH} to={VIEWER_PATH} />
       <SentryRoute component={PageNotFound} />
@@ -175,14 +180,14 @@ export default function AppRouter() {
   return (
     <Router history={history}>
       <Suspense fallback={loadingIndicator}>
-        <RouteChangeListener />
         {safeCrash && safeCrashCode ? (
           <>
             <ErrorPageHeader />
             <ErrorPage code={safeCrashCode} />
           </>
         ) : (
           <>
+            <RouteChangeListener />
             <Walkthrough>
               <AppHeader />
               <Routes />

app/client/src/ce/IDE/constants/routes.ts

@@ -5,6 +5,7 @@ import {
   BUILDER_CUSTOM_PATH,
   BUILDER_PATH,
   BUILDER_PATH_DEPRECATED,
+  BUILDER_PATH_STATIC,
   DATA_SOURCES_EDITOR_ID_PATH,
   ENTITY_PATH,
   INTEGRATION_EDITOR_PATH,
@@ -40,6 +41,11 @@ export const EntityPaths: string[] = [
 ];
 export const IDEBasePaths: Readonly<Record<IDEType, string[]>> = {
   [IDE_TYPE.None]: [],
-  [IDE_TYPE.App]: [BUILDER_PATH, BUILDER_PATH_DEPRECATED, BUILDER_CUSTOM_PATH],
+  [IDE_TYPE.App]: [
+    BUILDER_PATH,
+    BUILDER_PATH_DEPRECATED,
+    BUILDER_CUSTOM_PATH,
+    BUILDER_PATH_STATIC,
+  ],
   [IDE_TYPE.UIPackage]: [],
 };

app/client/src/ce/actions/applicationActions.ts

@@ -79,6 +79,34 @@ export const updateApplication = (
   };
 };
 
+export const persistAppSlug = (slug: string, onSuccess?: () => void) => {
+  return {
+    type: ReduxActionTypes.PERSIST_APP_SLUG,
+    payload: {
+      slug,
+      onSuccess,
+    },
+  };
+};
+
+export const validateAppSlug = (slug: string) => {
+  return {
+    type: ReduxActionTypes.VALIDATE_APP_SLUG,
+    payload: {
+      slug,
+    },
+  };
+};
+
+export const fetchAppSlugSuggestion = (applicationId: string) => {
+  return {
+    type: ReduxActionTypes.FETCH_APP_SLUG_SUGGESTION,
+    payload: {
+      applicationId,
+    },
+  };
+};
+
 export const updateCurrentApplicationIcon = (icon: IconNames) => {
   return {
     type: ReduxActionTypes.CURRENT_APPLICATION_ICON_UPDATE,
@@ -290,3 +318,28 @@ export const setIsAppSidebarPinned = (payload: boolean) => ({
 export const fetchAllPackages = () => {
   return {};
 };
+
+export const enableStaticUrl = (slug: string, onSuccess?: () => void) => {
+  return {
+    type: ReduxActionTypes.ENABLE_STATIC_URL,
+    payload: {
+      slug,
+      onSuccess,
+    },
+  };
+};
+
+export const disableStaticUrl = (onSuccess?: () => void) => {
+  return {
+    type: ReduxActionTypes.DISABLE_STATIC_URL,
+    payload: {
+      onSuccess,
+    },
+  };
+};
+
+export const resetAppSlugValidation = () => {
+  return {
+    type: ReduxActionTypes.RESET_APP_SLUG_VALIDATION,
+  };
+};

app/client/src/ce/api/ApplicationApi.tsx

@@ -35,6 +35,7 @@ export interface ApplicationPagePayload {
   slug: string;
   isHidden?: boolean;
   customSlug?: string;
+  uniqueSlug?: string;
   userPermissions?: string[];
 }
 
@@ -517,6 +518,52 @@ export class ApplicationApi extends Api {
   > {
     return Api.post(`${ApplicationApi.baseURL}/import/partial/block`, request);
   }
+
+  static async persistAppSlug(
+    applicationId: string,
+    request: {
+      branchedApplicationId: string;
+      uniqueApplicationSlug: string;
+    },
+  ): Promise<AxiosPromise<ApiResponse>> {
+    return Api.patch(
+      `${ApplicationApi.baseURL}/${applicationId}/static-url`,
+      request,
+    );
+  }
+
+  static async validateAppSlug(
+    applicationId: string,
+    uniqueSlug: string,
+  ): Promise<AxiosPromise<ApiResponse>> {
+    return Api.get(
+      `${ApplicationApi.baseURL}/${applicationId}/static-url/${uniqueSlug}`,
+    );
+  }
+
+  static async enableStaticUrl(
+    applicationId: string,
+    request: { uniqueApplicationSlug: string },
+  ): Promise<AxiosPromise<ApiResponse>> {
+    return Api.post(
+      `${ApplicationApi.baseURL}/${applicationId}/static-url`,
+      request,
+    );
+  }
+
+  static async disableStaticUrl(
+    applicationId: string,
+  ): Promise<AxiosPromise<ApiResponse>> {
+    return Api.delete(`${ApplicationApi.baseURL}/${applicationId}/static-url`);
+  }
+
+  static async fetchAppSlugSuggestion(
+    applicationId: string,
+  ): Promise<AxiosPromise<ApiResponse>> {
+    return Api.get(
+      `${ApplicationApi.baseURL}/${applicationId}/static-url/suggest-app-slug`,
+    );
+  }
 }
 
 export default ApplicationApi;

app/client/src/ce/constants/ReduxActionConstants.tsx

@@ -636,9 +636,28 @@ const PageActionErrorTypes = {
 };
 
 const ApplicationActionTypes = {
+  ENABLE_STATIC_URL: "ENABLE_STATIC_URL",
+  ENABLE_STATIC_URL_SUCCESS: "ENABLE_STATIC_URL_SUCCESS",
+  DISABLE_STATIC_URL: "DISABLE_STATIC_URL",
+  DISABLE_STATIC_URL_SUCCESS: "DISABLE_STATIC_URL_SUCCESS",
   UPDATE_APPLICATION: "UPDATE_APPLICATION",
   UPDATE_APP_LAYOUT: "UPDATE_APP_LAYOUT",
   UPDATE_APPLICATION_SUCCESS: "UPDATE_APPLICATION_SUCCESS",
+  PERSIST_APP_SLUG: "PERSIST_APP_SLUG",
+  PERSIST_APP_SLUG_SUCCESS: "PERSIST_APP_SLUG_SUCCESS",
+  PERSIST_APP_SLUG_ERROR: "PERSIST_APP_SLUG_ERROR",
+  RESET_APP_SLUG_VALIDATION: "RESET_APP_SLUG_VALIDATION",
+  VALIDATE_APP_SLUG: "VALIDATE_APP_SLUG",
+  VALIDATE_APP_SLUG_SUCCESS: "VALIDATE_APP_SLUG_SUCCESS",
+  VALIDATE_APP_SLUG_ERROR: "VALIDATE_APP_SLUG_ERROR",
+  PERSIST_PAGE_SLUG: "PERSIST_PAGE_SLUG",
+  PERSIST_PAGE_SLUG_SUCCESS: "PERSIST_PAGE_SLUG_SUCCESS",
+  PERSIST_PAGE_SLUG_ERROR: "PERSIST_PAGE_SLUG_ERROR",
+  VALIDATE_PAGE_SLUG: "VALIDATE_PAGE_SLUG",
+  VALIDATE_PAGE_SLUG_SUCCESS: "VALIDATE_PAGE_SLUG_SUCCESS",
+  VALIDATE_PAGE_SLUG_ERROR: "VALIDATE_PAGE_SLUG_ERROR",
+  FETCH_APP_SLUG_SUGGESTION: "FETCH_APP_SLUG_SUGGESTION",
+  FETCH_APP_SLUG_SUGGESTION_SUCCESS: "FETCH_APP_SLUG_SUGGESTION_SUCCESS",
   FETCH_APPLICATION_INIT: "FETCH_APPLICATION_INIT",
   FETCH_APPLICATION_SUCCESS: "FETCH_APPLICATION_SUCCESS",
   CREATE_APPLICATION_INIT: "CREATE_APPLICATION_INIT",
@@ -670,6 +689,9 @@ const ApplicationActionErrorTypes = {
   DELETE_APPLICATION_ERROR: "DELETE_APPLICATION_ERROR",
   SET_DEFAULT_APPLICATION_PAGE_ERROR: "SET_DEFAULT_APPLICATION_PAGE_ERROR",
   FORK_APPLICATION_ERROR: "FORK_APPLICATION_ERROR",
+  FETCH_APP_SLUG_SUGGESTION_ERROR: "FETCH_APP_SLUG_SUGGESTION_ERROR",
+  ENABLE_STATIC_URL_ERROR: "ENABLE_STATIC_URL_ERROR",
+  DISABLE_STATIC_URL_ERROR: "DISABLE_STATIC_URL_ERROR",
 };
 
 const IDEDebuggerActionTypes = {