diff --git a/crates/frontend/src/app.rs b/crates/frontend/src/app.rs
index c3dea451b..23a8dd2e1 100755
--- a/crates/frontend/src/app.rs
+++ b/crates/frontend/src/app.rs
@@ -29,6 +29,7 @@ use crate::pages::{
     experiment::ExperimentPage,
     home::Home,
     organisations::Organisations,
+    override_page::{CreateOverride, EditOverride, OverridePage},
     type_template::TypePage,
     type_templates::TypesPage,
     webhook::Webhook,
@@ -306,6 +307,35 @@ pub fn App(app_envs: Envs) -> impl IntoView {
                             view=ContextOverride
                         />
 
+                        <Route
+                            ssr=SsrMode::Async
+                            path=join_route_parts([
+                                RouteSegment::Overrides,
+                                RouteSegment::Action,
+                                RouteSegment::Create,
+                            ])
+                            view=CreateOverride
+                        />
+
+                        <Route
+                            ssr=SsrMode::Async
+                            path=join_route_parts([
+                                RoutePart::from(RouteSegment::Overrides),
+                                RoutePart::from("context_id"),
+                                RoutePart::from(RouteSegment::Edit),
+                            ])
+                            view=EditOverride
+                        />
+
+                        <Route
+                            ssr=SsrMode::Async
+                            path=join_route_parts([
+                                RoutePart::from(RouteSegment::Overrides),
+                                RoutePart::from("context_id"),
+                            ])
+                            view=OverridePage
+                        />
+
                         <Route
                             ssr=SsrMode::Async
                             path=join_route_parts([RouteSegment::Resolve])
diff --git a/crates/frontend/src/components.rs b/crates/frontend/src/components.rs
index 2318f726d..9d1ed615f 100644
--- a/crates/frontend/src/components.rs
+++ b/crates/frontend/src/components.rs
@@ -9,6 +9,7 @@ pub mod cohort_schema;
 pub mod condition_pills;
 pub mod context_card;
 pub mod context_form;
+pub mod context_override_form;
 pub mod datetime;
 pub mod default_config_form;
 pub mod delete_modal;
@@ -38,6 +39,7 @@ pub mod side_nav;
 pub mod skeleton;
 pub mod sortable;
 pub mod stat;
+pub mod step_indicator;
 pub mod table;
 pub mod tip;
 pub mod toast;
diff --git a/crates/frontend/src/components/button.rs b/crates/frontend/src/components/button.rs
index 4d65753fa..b62553c39 100644
--- a/crates/frontend/src/components/button.rs
+++ b/crates/frontend/src/components/button.rs
@@ -17,6 +17,7 @@ pub fn Button(
     #[prop(into, default = String::new())] id: String,
     #[prop(into, default = String::from("ri-edit-2-line"))] icon_class: String,
     #[prop(default = false)] loading: bool,
+    #[prop(default = false)] disabled: bool,
     #[prop(default = ButtonStyle::Fill)] style: ButtonStyle,
     #[prop(into, optional)] force_style: Option<String>,
 ) -> impl IntoView {
@@ -33,7 +34,8 @@ pub fn Button(
 
     move || {
         let loading = loading || !*client_side_ready.get();
-        let loading_class = if loading {
+        let is_disabled = loading || disabled;
+        let disabled_class = if is_disabled {
             "hover:cursor-not-allowed"
         } else {
             ""
@@ -41,10 +43,10 @@ pub fn Button(
 
         view! {
             <button
-                class=format!("{common_style} {style} {class} {loading_class}")
+                class=format!("{common_style} {style} {class} {disabled_class}")
                 id=id.clone()
                 on:click=move |e| on_click.call(e)
-                disabled=loading
+                disabled=is_disabled
             >
                 {if loading {
                     view! { <span class="loading loading-dots loading-sm" /> }.into_view()
diff --git a/crates/frontend/src/components/context_card.rs b/crates/frontend/src/components/context_card.rs
index c3014b857..6dd141753 100644
--- a/crates/frontend/src/components/context_card.rs
+++ b/crates/frontend/src/components/context_card.rs
@@ -1,16 +1,12 @@
-use std::ops::Deref;
-
 use leptos::*;
+use leptos_router::A;
 use serde_json::{Map, Value};
 use superposition_types::database::models::cac::Context;
 
 use crate::{
     components::{
         condition_pills::Condition as ConditionComponent,
-        datetime::Datetime,
-        description::InfoDescription,
         table::{Table, types::Column},
-        tooltip::Tooltip,
     },
     logic::Conditions,
 };
@@ -42,7 +38,11 @@ fn ContextOptions(
 ) -> impl IntoView {
     view! {
         <div class="w-fit dropdown dropdown-left">
-            <label tabindex="0" class="btn btn-sm text-xs m-1 w-full">
+            <label
+                tabindex="0"
+                class="btn btn-sm text-xs m-1 w-full"
+                on:click=|ev: web_sys::MouseEvent| ev.stop_propagation()
+            >
                 <i class="ri-more-2-fill" />
             </label>
             <ul
@@ -86,6 +86,7 @@ pub fn ContextCard(
     context: Context,
     overrides: Map<String, Value>,
     #[prop(default = true)] show_actions: bool,
+    #[prop(into)] href: String,
     #[prop(into)] handle_create_experiment: Callback<String, ()>,
     #[prop(into)] handle_delete_experiment: Callback<String, ()>,
     #[prop(into)] handle_edit: Callback<String, ()>,
@@ -93,8 +94,6 @@ pub fn ContextCard(
     #[prop(into)] handle_delete: Callback<String, ()>,
 ) -> impl IntoView {
     let conditions = Conditions::from_iter(context.value.clone().into_inner());
-    let description = context.description.clone();
-    let change_reason = context.change_reason.clone();
 
     let override_table_rows = overrides
         .clone()
@@ -108,6 +107,7 @@ pub fn ContextCard(
         .collect::<Vec<Map<String, Value>>>();
 
     let context = store_value(context);
+    let href = store_value(href);
 
     let table_columns = vec![
         Column::default_no_collapse("KEY".to_string()),
@@ -118,47 +118,18 @@ pub fn ContextCard(
         show_actions && !conditions.0.iter().any(|c| c.variable == "variantIds");
 
     view! {
-        <div class="rounded-lg shadow bg-base-100 p-6 flex flex-col gap-4">
+        <div class="block rounded-lg shadow bg-base-100 p-6 flex flex-col gap-4">
             <div class="flex justify-between">
                 <div class="flex gap-4 items-center">
                     <h3 class="card-title text-base timeline-box text-gray-800 bg-base-100 shadow-md m-0 w-max">
                         "Condition"
                     </h3>
-                    <InfoDescription
-                        description=description.deref().to_string()
-                        change_reason=change_reason.deref().to_string()
-                    />
-                    <Tooltip icon_class="ri-information-line ri-lg">
-                        <div class="flex flex-col gap-4">
-                            <div class="flex flex-col gap-1">
-                                <div class="font-bold">"Created"</div>
-                                <div class="flex gap-1 items-center">
-                                    <i class="ri-user-line text-gray-950" />
-                                    <span>{context.with_value(|c| c.created_by.clone())}</span>
-                                </div>
-                                <div class="flex gap-1 items-center">
-                                    <i class="ri-time-line text-gray-950" />
-                                    <Datetime datetime=context.with_value(|c| c.created_at) />
-                                </div>
-                            </div>
-                            <div class="flex flex-col gap-1">
-                                <div class="font-bold">"Last Modified"</div>
-                                <div class="flex gap-1 items-center">
-                                    <i class="ri-user-line text-gray-950" />
-                                    <span>
-                                        {context.with_value(|c| c.last_modified_by.clone())}
-                                    </span>
-                                </div>
-                                <div class="flex gap-1 items-center">
-                                    <i class="ri-time-line text-gray-950" />
-                                    <Datetime datetime=context.with_value(|c| c.last_modified_at) />
-                                </div>
-                            </div>
-                        </div>
-                    </Tooltip>
                 </div>
                 <Show when=move || actions_supported>
-                    <div class="h-fit flex gap-4 text-right">
+                    <div class="h-fit flex gap-2 items-center text-right">
+                        <A href=href.with_value(|h| h.clone()) class="btn btn-sm btn-ghost">
+                            {"See More"}
+                        </A>
                         <ContextOptions
                             handle_create_experiment=move |_| {
                                 handle_create_experiment.call(context.with_value(|c| c.id.clone()))
diff --git a/crates/frontend/src/components/context_override_form.rs b/crates/frontend/src/components/context_override_form.rs
new file mode 100644
index 000000000..1d06e2ab5
--- /dev/null
+++ b/crates/frontend/src/components/context_override_form.rs
@@ -0,0 +1,487 @@
+use std::ops::Deref;
+
+use leptos::*;
+use leptos_router::use_navigate;
+use serde_json::{Map, Value};
+use superposition_types::{
+    api::{
+        context::UpdateRequest, dimension::DimensionResponse,
+        functions::FunctionEnvironment,
+    },
+    database::models::cac::DefaultConfig,
+};
+
+use superposition_types::database::models::{ChangeReason, Description};
+
+use crate::{
+    components::{
+        alert::AlertType,
+        button::{ButtonAnchor, ButtonStyle},
+        change_form::ChangeForm,
+        change_summary::ChangeLogPopup,
+        condition_pills::Condition,
+        context_form::ContextForm,
+        override_form::OverrideForm,
+        skeleton::{Skeleton, SkeletonVariant},
+        step_indicator::{Step, StepIndicator, StepNavigation, StepType},
+        table::{Table, types::Column},
+    },
+    logic::Conditions,
+    pages::context_override::utils::{
+        create_context, try_update_context_payload, update_context,
+    },
+    providers::{
+        alert_provider::enqueue_alert,
+        condition_collapse_provider::ConditionCollapseProvider,
+        editor_provider::EditorProvider,
+    },
+    types::{OrganisationId, Workspace},
+};
+
+enum ResponseType {
+    Response(Option<String>), // Option<String> for new context_id on create
+    UpdatePrecheck,
+}
+
+#[derive(Clone)]
+pub enum ChangeType {
+    Delete,
+    Update(UpdateRequest),
+}
+
+#[component]
+pub fn ContextOverrideForm(
+    #[prop(default = false)] edit: bool,
+    #[prop(optional)] context_id: Option<String>,
+    context: Conditions,
+    overrides: Vec<(String, Value)>,
+    dimensions: Vec<DimensionResponse>,
+    default_config: Vec<DefaultConfig>,
+    #[prop(default = String::new())] description: String,
+    #[prop(default = String::new())] change_reason: String,
+    #[prop(into)] redirect_url_cancel: String,
+    #[prop(into)] redirect_url_success: String,
+) -> impl IntoView {
+    let workspace = use_context::<Signal<Workspace>>().unwrap();
+    let org = use_context::<Signal<OrganisationId>>().unwrap();
+    let dimensions = StoredValue::new(dimensions);
+    let default_config = StoredValue::new(default_config);
+    let context_id = StoredValue::new(context_id);
+
+    let (context_rs, context_ws) = create_signal(context);
+    let (overrides_rs, overrides_ws) = create_signal(overrides);
+    let (description_rs, description_ws) = create_signal(description);
+    let (change_reason_rs, change_reason_ws) = create_signal(change_reason);
+    let (req_inprogress_rs, req_inprogress_ws) = create_signal(false);
+    let update_request_rws = RwSignal::new(None);
+
+    // Step state using StepType enum
+    let current_step = RwSignal::new(StepType::ContextStep);
+
+    let steps = vec![
+        Step {
+            title: "Context & Metadata".to_string(),
+            description: Some("Define context conditions and description".to_string()),
+            step_type: StepType::ContextStep,
+        },
+        Step {
+            title: "Overrides".to_string(),
+            description: Some("Configure override values".to_string()),
+            step_type: StepType::OverrideStep,
+        },
+    ];
+
+    let fn_environment = Memo::new(move |_| FunctionEnvironment {
+        context: context_rs.get().into(),
+        overrides: Map::from_iter(overrides_rs.get()),
+    });
+
+    let on_previous = Callback::new(move |_| {
+        current_step.update(|step| {
+            *step = match step {
+                StepType::OverrideStep => StepType::ContextStep,
+                StepType::ContextStep => StepType::ContextStep,
+            };
+        });
+    });
+
+    let on_next = Callback::new(move |_| {
+        current_step.update(|step| {
+            *step = match step {
+                StepType::ContextStep => StepType::OverrideStep,
+                StepType::OverrideStep => StepType::OverrideStep,
+            };
+        });
+    });
+
+    let redirect_url_success = StoredValue::new(redirect_url_success);
+    let on_submit = Callback::new(move |_: ()| {
+        req_inprogress_ws.set(true);
+        spawn_local(async move {
+            let f_overrides = overrides_rs.get_untracked();
+            let workspace = workspace.get_untracked();
+            let org = org.get_untracked();
+            let redirect_url = redirect_url_success.get_value();
+            let result =
+                match (context_id.get_value(), update_request_rws.get_untracked()) {
+                    (Some(_), Some((_, payload))) => {
+                        let future = update_context(payload, &workspace, &org);
+                        update_request_rws.set(None);
+                        future.await.map(|_| ResponseType::Response(None))
+                    }
+                    (Some(ctx_id), None) => {
+                        let request_payload = try_update_context_payload(
+                            ctx_id.clone(),
+                            Map::from_iter(f_overrides),
+                            description_rs.get_untracked(),
+                            change_reason_rs.get_untracked(),
+                        );
+                        match request_payload {
+                            Ok(payload) => {
+                                update_request_rws.set(Some((ctx_id, payload)));
+                                Ok(ResponseType::UpdatePrecheck)
+                            }
+                            Err(e) => Err(e),
+                        }
+                    }
+                    _ => create_context(
+                        Map::from_iter(f_overrides),
+                        context_rs.get_untracked(),
+                        description_rs.get_untracked(),
+                        change_reason_rs.get_untracked(),
+                        &workspace,
+                        &org,
+                    )
+                    .await
+                    .map(|ctx| ResponseType::Response(Some(ctx.id))),
+                };
+
+            let is_edit = context_id.get_value().is_some();
+
+            req_inprogress_ws.set(false);
+            match result {
+                Ok(ResponseType::UpdatePrecheck) => (),
+                Ok(ResponseType::Response(new_context_id)) => {
+                    logging::log!("Context and overrides submitted successfully");
+                    let navigate = use_navigate();
+                    let final_redirect_url = match new_context_id {
+                        Some(id) => {
+                            // For create, navigate to the detail page of the newly created override
+                            format!("/admin/{}/{}/overrides/{}", org.0, workspace.0, id)
+                        }
+                        None => redirect_url.clone(),
+                    };
+                    navigate(&final_redirect_url, Default::default());
+                    let success_message = if is_edit {
+                        "Context and overrides updated successfully!"
+                    } else {
+                        "Context and overrides created successfully!"
+                    };
+                    enqueue_alert(
+                        String::from(success_message),
+                        AlertType::Success,
+                        5000,
+                    );
+                }
+                Err(e) => {
+                    logging::log!("Error submitting context and overrides: {:?}", e);
+                    enqueue_alert(e, AlertType::Error, 5000);
+                }
+            }
+        });
+    });
+
+    view! {
+        <div class="flex flex-col gap-6">
+            <div class="flex justify-between items-center">
+                <h1 class="text-2xl font-extrabold">
+                    {if edit { "Edit Override" } else { "Create Override" }}
+                </h1>
+                <ButtonAnchor
+                    text="Cancel".to_string()
+                    href=redirect_url_cancel.clone()
+                    icon_class="ri-close-line".to_string()
+                    style=ButtonStyle::Outline
+                />
+            </div>
+
+            <StepIndicator steps=&steps current_step=current_step />
+
+            <EditorProvider>
+                <div class="card bg-base-100 shadow">
+                    <div class="card-body">
+                        <Show when=move || current_step.get() == StepType::ContextStep>
+                            <div class="flex flex-col gap-5">
+                                <ContextForm
+                                    dimensions=dimensions.get_value()
+                                    context=context_rs.get_untracked()
+                                    on_context_change=move |new_context| context_ws.set(new_context)
+                                    fn_environment=fn_environment
+                                    disabled=edit
+                                />
+
+                                <ChangeForm
+                                    title="Description".to_string()
+                                    placeholder="Enter a description".to_string()
+                                    value=description_rs.get_untracked()
+                                    on_change=move |new_description| {
+                                        description_ws.set(new_description)
+                                    }
+                                />
+
+                                <ChangeForm
+                                    title="Reason for Change".to_string()
+                                    placeholder="Enter a reason for this change".to_string()
+                                    value=change_reason_rs.get_untracked()
+                                    on_change=move |new_change_reason| {
+                                        change_reason_ws.set(new_change_reason)
+                                    }
+                                />
+                            </div>
+                        </Show>
+
+                        <Show when=move || current_step.get() == StepType::OverrideStep>
+                            <div class="flex flex-col gap-4">
+                                <h2 class="card-title">"Context"</h2>
+                                <div class="flex flex-row flex-wrap gap-2">
+                                    <ConditionCollapseProvider>
+                                        <Condition
+                                            conditions=context_rs.get_untracked()
+                                            id="override-form-context"
+                                            class="h-fit w-[300px]"
+                                        />
+                                    </ConditionCollapseProvider>
+                                </div>
+                                <div class="min-h-[400px] max-h-[60vh] overflow-y-auto">
+                                    <OverrideForm
+                                        overrides=overrides_rs.get_untracked()
+                                        default_config=default_config.get_value()
+                                        handle_change=move |new_overrides| {
+                                            overrides_ws.set(new_overrides)
+                                        }
+                                        fn_environment=fn_environment
+                                    />
+                                </div>
+                            </div>
+                        </Show>
+
+                        <StepNavigation
+                            current_step=current_step
+                            on_previous=on_previous
+                            on_next=on_next
+                            on_submit=on_submit
+                            submit_loading=req_inprogress_rs
+                        />
+                    </div>
+                </div>
+            </EditorProvider>
+        </div>
+
+        {move || match update_request_rws.get() {
+            None => ().into_view(),
+            Some((ctx_id, update_request)) => {
+                view! {
+                    <ChangeLogSummary
+                        context_id=ctx_id
+                        change_type=ChangeType::Update(update_request)
+                        on_confirm=on_submit
+                        on_close=Callback::new(move |_| update_request_rws.set(None))
+                    />
+                }
+            }
+        }}
+    }
+}
+
+#[component]
+fn ChangeLogSummary(
+    context_id: String,
+    change_type: ChangeType,
+    #[prop(into)] on_confirm: Callback<()>,
+    #[prop(into)] on_close: Callback<()>,
+    #[prop(default = Signal::derive(|| false))] inprogress: Signal<bool>,
+) -> impl IntoView {
+    let workspace = use_context::<Signal<Workspace>>().unwrap();
+    let org = use_context::<Signal<OrganisationId>>().unwrap();
+
+    let context_resource = create_local_resource(
+        move || (workspace.get().0, org.get().0, context_id.clone()),
+        |(workspace, org, context_id)| async move {
+            crate::api::get_context(&context_id, &workspace, &org)
+                .await
+                .map(|context| {
+                    let conditions =
+                        Conditions::from_iter(context.value.clone().into_inner());
+                    (context, conditions)
+                })
+        },
+    );
+
+    let disabled_rws = RwSignal::new(true);
+    let change_type = StoredValue::new(change_type);
+
+    let (title, description, confirm_text) = match change_type.get_value() {
+        ChangeType::Update(_) => (
+            "Confirm Update",
+            "Are you sure you want to update this context?",
+            "Yes, Update",
+        ),
+        ChangeType::Delete => (
+            "Confirm Delete",
+            "Are you sure you want to delete this context? Action is irreversible.",
+            "Yes, Delete",
+        ),
+    };
+
+    view! {
+        <ChangeLogPopup
+            title
+            description
+            confirm_text
+            on_confirm
+            on_close
+            disabled=disabled_rws
+            inprogress
+        >
+            <Suspense fallback=move || {
+                view! { <Skeleton variant=SkeletonVariant::Block style_class="h-10".to_string() /> }
+            }>
+                {
+                    Effect::new(move |_| {
+                        let context = context_resource.get();
+                        if let Some(Ok(_)) = context {
+                            disabled_rws.set(false);
+                        } else if let Some(Err(e)) = context {
+                            logging::error!("Error fetching context: {}", e);
+                        }
+                    });
+                }
+                {move || match context_resource.get() {
+                    Some(Ok((context, _))) => {
+                        let (new_overrides, title, desc) = match change_type.get_value() {
+                            ChangeType::Update(update_request) => {
+                                (
+                                    update_request.override_.clone().into_inner().into(),
+                                    "Override changes",
+                                    update_request
+                                        .description
+                                        .unwrap_or_else(|| context.description.clone()),
+                                )
+                            }
+                            ChangeType::Delete => {
+                                (Map::new(), "Overrides to be deleted", context.description.clone())
+                            }
+                        };
+                        view! {
+                            <crate::components::change_summary::ChangeSummary
+                                title
+                                old_values=context.override_.clone().into()
+                                new_values=new_overrides
+                            />
+                            <crate::components::change_summary::ChangeSummary
+                                title="Other changes"
+                                key_column="Property"
+                                old_values=Map::from_iter(
+                                    vec![
+                                        (
+                                            "Description".to_string(),
+                                            Value::String(context.description.deref().to_string()),
+                                        ),
+                                    ],
+                                )
+                                new_values=Map::from_iter(
+                                    vec![
+                                        (
+                                            "Description".to_string(),
+                                            Value::String(desc.deref().to_string()),
+                                        ),
+                                    ],
+                                )
+                            />
+                        }
+                            .into_view()
+                    }
+                    Some(Err(e)) => {
+                        logging::error!("Error fetching context: {}", e);
+                        view! { <div>Error fetching context</div> }.into_view()
+                    }
+                    None => view! { <div>Loading...</div> }.into_view(),
+                }}
+            </Suspense>
+        </ChangeLogPopup>
+    }
+}
+
+/// Component to display override details in a read-only view
+#[component]
+pub fn OverrideDetailView(
+    context: Conditions,
+    overrides: Vec<(String, Value)>,
+    description: Description,
+    override_id: String,
+    change_reason: String,
+    created_by: String,
+    created_at: chrono::DateTime<chrono::Utc>,
+    last_modified_by: String,
+    last_modified_at: chrono::DateTime<chrono::Utc>,
+) -> impl IntoView {
+    let override_table_rows = overrides
+        .into_iter()
+        .map(|(k, v)| {
+            Map::from_iter(vec![
+                (String::from("KEY"), Value::String(k)),
+                (String::from("VALUE"), v),
+            ])
+        })
+        .collect::<Vec<Map<String, Value>>>();
+
+    let table_columns = vec![
+        Column::default_no_collapse("KEY".to_string()),
+        Column::default("VALUE".to_string()),
+    ];
+
+    view! {
+        <div class="flex flex-col gap-4">
+            <div class="block rounded-lg shadow bg-base-100 p-6 flex flex-col gap-4">
+                <div class="flex justify-between items-center">
+                    <div class="flex gap-4 items-center">
+                        <div class="stat-title">"Override ID"</div>
+                        <div class="text-sm font-mono bg-base-200 px-2 py-1 rounded">
+                            {override_id}
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <crate::components::description::ContentDescription
+                description=description
+                change_reason=ChangeReason::try_from(change_reason).unwrap_or_default()
+                created_by=created_by
+                created_at=created_at
+                last_modified_by=last_modified_by
+                last_modified_at=last_modified_at
+            />
+
+            <div class="card bg-base-100 shadow">
+                <div class="card-body flex flex-row gap-2 flex-wrap">
+                    <h3 class="card-title text-base timeline-box text-gray-800 bg-base-100 shadow-md m-0 w-max">
+                        "Condition"
+                    </h3>
+                    <ConditionCollapseProvider>
+                        <Condition
+                            conditions=context
+                            id="override-detail-context"
+                            class="h-fit w-[300px]"
+                        />
+                    </ConditionCollapseProvider>
+                </div>
+            </div>
+
+            <div class="card bg-base-100 shadow">
+                <div class="card-body">
+                    <Table rows=override_table_rows key_column="KEY" columns=table_columns />
+                </div>
+            </div>
+        </div>
+    }
+}
diff --git a/crates/frontend/src/components/step_indicator.rs b/crates/frontend/src/components/step_indicator.rs
new file mode 100644
index 000000000..9ffb915af
--- /dev/null
+++ b/crates/frontend/src/components/step_indicator.rs
@@ -0,0 +1,251 @@
+use leptos::*;
+use strum_macros::Display;
+use web_sys::MouseEvent;
+
+use crate::components::button::{Button, ButtonStyle};
+
+#[derive(Clone, Copy, PartialEq, PartialOrd, Display)]
+#[strum(serialize_all = "snake_case")]
+pub enum StepType {
+    ContextStep,
+    OverrideStep,
+}
+
+#[derive(Clone, Copy, PartialEq)]
+pub enum StepStatus {
+    Active,
+    Completed,
+    Pending,
+}
+
+#[derive(Clone)]
+pub struct Step {
+    pub title: String,
+    pub description: Option<String>,
+    pub step_type: StepType,
+}
+
+// Removing 'a causes a compile error, seems to be a clippy false positive
+#[allow(clippy::needless_lifetimes)]
+#[component]
+pub fn StepIndicator<'a>(
+    steps: &'a [Step],
+    #[prop(into)] current_step: MaybeSignal<StepType>,
+    #[prop(into, optional)] on_step_click: Option<Callback<usize, ()>>,
+) -> impl IntoView {
+    let total_steps = steps.len();
+
+    view! {
+        <div class="w-full">
+            <div class="flex items-center justify-center">
+                {steps
+                    .iter()
+                    .enumerate()
+                    .map(move |(idx, step)| {
+                        let title = step.title.clone();
+                        let description = step.description.clone();
+                        let step_type = step.step_type;
+
+                        view! {
+                            <div class="flex items-center">
+                                <div class="flex flex-col items-center">
+                                    <div
+                                        class=move || {
+                                            let cs = current_step.get();
+                                            let common = "w-10 h-10 rounded-full flex items-center justify-center font-semibold text-lg border-2";
+                                            if step_type == cs {
+                                                format!(
+                                                    "{} bg-purple-600 text-white border-purple-600",
+                                                    common,
+                                                )
+                                            } else if step_type < cs {
+                                                format!(
+                                                    "{} bg-purple-100 text-purple-600 border-purple-600",
+                                                    common,
+                                                )
+                                            } else {
+                                                format!(
+                                                    "{} bg-gray-100 text-gray-400 border-gray-300",
+                                                    common,
+                                                )
+                                            }
+                                        }
+                                        class:cursor-pointer=move || {
+                                            let cs = current_step.get();
+                                            on_step_click.is_some() && step_type <= cs
+                                        }
+                                        class:hover:ring-2=move || {
+                                            let cs = current_step.get();
+                                            on_step_click.is_some() && step_type <= cs
+                                        }
+                                        class:hover:ring-purple-300=move || {
+                                            let cs = current_step.get();
+                                            on_step_click.is_some() && step_type <= cs
+                                        }
+                                        class:transition-all=true
+                                        on:click=move |_| {
+                                            let cs = current_step.get_untracked();
+                                            if let Some(callback) = on_step_click {
+                                                if step_type <= cs {
+                                                    callback.call(idx);
+                                                }
+                                            }
+                                        }
+                                    >
+                                        {move || {
+                                            let cs = current_step.get();
+                                            let is_completed = step_type < cs;
+                                            if is_completed {
+                                                view! { <i class="ri-check-line text-xl"></i> }.into_view()
+                                            } else {
+                                                view! { <span>{idx + 1}</span> }.into_view()
+                                            }
+                                        }}
+                                    </div>
+                                    <div class="mt-2 text-center">
+                                        <p class=move || {
+                                            let cs = current_step.get();
+                                            let is_active = step_type == cs;
+                                            let is_completed = step_type < cs;
+                                            if is_active {
+                                                "text-sm font-semibold text-purple-600"
+                                            } else if is_completed {
+                                                "text-sm font-semibold text-purple-500"
+                                            } else {
+                                                "text-sm font-medium text-gray-400"
+                                            }
+                                        }>{title}</p>
+                                        {description
+                                            .map(|desc| {
+                                                view! {
+                                                    <p class=move || {
+                                                        let cs = current_step.get();
+                                                        if step_type == cs {
+                                                            "text-xs text-gray-600"
+                                                        } else {
+                                                            "text-xs text-gray-400"
+                                                        }
+                                                    }>{desc}</p>
+                                                }
+                                            })}
+                                    </div>
+                                </div>
+                                {if idx != total_steps - 1 {
+                                    view! {
+                                        <div class=move || {
+                                            let cs = current_step.get();
+                                            if step_type < cs {
+                                                "flex-1 h-1 bg-purple-600 mx-4 mt-[-24px]"
+                                            } else {
+                                                "flex-1 h-1 bg-gray-300 mx-4 mt-[-24px]"
+                                            }
+                                        }></div>
+                                    }
+                                        .into_view()
+                                } else {
+                                    ().into_view()
+                                }}
+                            </div>
+                        }
+                    })
+                    .collect_view()}
+            </div>
+        </div>
+    }
+}
+
+#[component]
+pub fn StepNavigation(
+    #[prop(into)] current_step: MaybeSignal<StepType>,
+    #[prop(into)] on_previous: Callback<(), ()>,
+    #[prop(into)] on_next: Callback<(), ()>,
+    #[prop(optional)] on_submit: Option<Callback<(), ()>>,
+    #[prop(default = false)] is_last_step: bool,
+    #[prop(default = false)] next_disabled: bool,
+    #[prop(into, optional)] submit_loading: MaybeSignal<bool>,
+    #[prop(default = "Next".to_string())] next_text: String,
+    #[prop(default = "Submit".to_string())] submit_text: String,
+    #[prop(default = "Previous".to_string())] previous_text: String,
+) -> impl IntoView {
+    let _is_last_step = is_last_step; // Used for future extensibility
+    let on_submit = StoredValue::new(on_submit);
+    let next_text = StoredValue::new(next_text);
+    let submit_text = StoredValue::new(submit_text);
+    let previous_text = StoredValue::new(previous_text);
+
+    let show_previous = move || -> bool {
+        let step = current_step.get();
+        step != StepType::ContextStep
+    };
+
+    view! {
+        <div class="flex justify-between items-center pt-6 pb-2">
+            <div>
+                {move || {
+                    if show_previous() {
+                        let on_prev_click = Callback::new(move |_: MouseEvent| {
+                            on_previous.call(())
+                        });
+                        view! {
+                            <Button
+                                text=previous_text.get_value()
+                                on_click=on_prev_click
+                                icon_class="ri-arrow-left-line"
+                                style=ButtonStyle::Outline
+                            />
+                        }
+                            .into_view()
+                    } else {
+                        ().into_view()
+                    }
+                }}
+            </div>
+            <div class="flex gap-3">
+                {move || {
+                    if current_step.get() == StepType::OverrideStep {
+                        let cb = on_submit.get_value();
+                        let on_submit_click = Callback::new(move |_: MouseEvent| {
+                            if let Some(callback) = cb {
+                                callback.call(());
+                            }
+                        });
+                        view! {
+                            <Button
+                                text=submit_text.get_value()
+                                on_click=on_submit_click
+                                icon_class="ri-check-line"
+                                loading=submit_loading.get()
+                            />
+                        }
+                            .into_view()
+                    } else {
+                        let on_next_click = Callback::new(move |_: MouseEvent| on_next.call(()));
+                        view! {
+                            <Button
+                                text=next_text.get_value()
+                                on_click=on_next_click
+                                icon_class="ri-arrow-right-line"
+                                disabled=next_disabled
+                            />
+                        }
+                            .into_view()
+                    }
+                }}
+            </div>
+        </div>
+    }
+}
+
+#[component]
+pub fn MultiStepForm(
+    steps: Vec<Step>,
+    current_step: RwSignal<StepType>,
+    children: Children,
+) -> impl IntoView {
+    view! {
+        <div class="flex flex-col gap-6">
+            <StepIndicator steps=&steps current_step=current_step />
+            <div class="flex-1">{children()}</div>
+        </div>
+    }
+}
diff --git a/crates/frontend/src/pages.rs b/crates/frontend/src/pages.rs
index 88e62fd89..378cf3498 100644
--- a/crates/frontend/src/pages.rs
+++ b/crates/frontend/src/pages.rs
@@ -16,6 +16,7 @@ pub mod function;
 pub mod home;
 pub mod not_found;
 pub mod organisations;
+pub mod override_page;
 pub mod secret;
 pub mod secrets_list;
 pub mod type_template;
diff --git a/crates/frontend/src/pages/context_override.rs b/crates/frontend/src/pages/context_override.rs
index 2ccaa46be..72dcb0da9 100644
--- a/crates/frontend/src/pages/context_override.rs
+++ b/crates/frontend/src/pages/context_override.rs
@@ -33,7 +33,7 @@ use crate::{
     api::{default_configs, delete_context, dimensions, fetch_context, get_context},
     components::{
         alert::AlertType,
-        button::{Button, ButtonStyle},
+        button::{Button, ButtonAnchor, ButtonStyle},
         change_form::ChangeForm,
         change_summary::{ChangeLogPopup, ChangeSummary},
         context_card::ContextCard,
@@ -73,9 +73,6 @@ struct PageResource {
 
 #[derive(Debug, Clone)]
 enum FormMode {
-    Edit(String),
-    Clone(String),
-    Create,
     Experiment(ExperimentType, String),
     Delete(String),
 }
@@ -238,7 +235,7 @@ fn Form(
 }
 
 #[allow(clippy::type_complexity)]
-fn use_context_data(
+pub fn use_context_data(
     context_id: String,
 ) -> Resource<(String, String, String), Result<(Context, Conditions), String>> {
     let workspace = use_context::<Signal<Workspace>>().unwrap();
@@ -441,25 +438,12 @@ pub fn ContextOverride() -> impl IntoView {
         },
     );
 
-    let on_create_context_click = Callback::new(move |_| {
-        set_form_mode.set(Some(FormMode::Create));
-        open_drawer("context_and_override_drawer");
-    });
-
-    let on_submit = move |edit: bool| {
-        close_drawer("context_and_override_drawer");
-        if !edit {
-            context_filters_rws.set(ContextListFilters::default());
-            dimension_params_rws.set(DimensionQuery::default());
-            pagination_params_rws.update(|f| f.reset_page());
-        }
-        set_form_mode.set(None);
-        page_resource.refetch();
-    };
-
     let on_context_edit = move |context_id| {
-        set_form_mode.set(Some(FormMode::Edit(context_id)));
-        open_drawer("context_and_override_drawer");
+        let navigate = use_navigate();
+        let workspace = workspace.get().0;
+        let org = org.get().0;
+        let url = format!("/admin/{}/{}/overrides/{}/edit", org, workspace, context_id);
+        navigate(&url, Default::default());
     };
 
     let handle_submit_experiment_form = move |experiment_id: String| {
@@ -491,8 +475,14 @@ pub fn ContextOverride() -> impl IntoView {
     };
 
     let on_context_clone = move |context_id| {
-        set_form_mode.set(Some(FormMode::Clone(context_id)));
-        open_drawer("context_and_override_drawer");
+        let navigate = use_navigate();
+        let workspace = workspace.get().0;
+        let org = org.get().0;
+        let url = format!(
+            "/admin/{}/{}/overrides/action/create?clone={}",
+            org, workspace, context_id
+        );
+        navigate(&url, Default::default());
     };
 
     let on_context_delete = move |context_id| {
@@ -616,10 +606,9 @@ pub fn ContextOverride() -> impl IntoView {
                                         text="Filters"
                                         icon_class="ri-filter-3-line"
                                     />
-                                    <DrawerBtn
+                                    <ButtonAnchor
                                         class="h-fit"
-                                        drawer_id="context_and_override_drawer"
-                                        on_click=on_create_context_click
+                                        href="action/create"
                                         text="Create Override"
                                         icon_class="ri-add-line"
                                     />
@@ -654,10 +643,12 @@ pub fn ContextOverride() -> impl IntoView {
                                                 .data
                                                 .into_iter()
                                                 .map(|context| {
+                                                    let detail_href = context.id.clone();
                                                     view! {
                                                         <ContextCard
                                                             context=context.clone()
                                                             overrides=context.override_.into()
+                                                            href=detail_href
                                                             handle_create_experiment=handle_create_experiment
                                                             handle_edit=on_context_edit
                                                             handle_clone=on_context_clone
@@ -708,15 +699,13 @@ pub fn ContextOverride() -> impl IntoView {
                         .into_view();
                 }
                 let drawer_header = match form_mode.get() {
-                    Some(FormMode::Edit(_)) => "Update Overrides",
-                    Some(FormMode::Create) | Some(FormMode::Clone(_)) => "Create Overrides",
                     Some(FormMode::Experiment(ExperimentType::Default, _)) => {
                         "Update Override via Experiment"
                     }
                     Some(FormMode::Experiment(ExperimentType::DeleteOverrides, _)) => {
                         "Delete Override via Experiment"
                     }
-                    Some(FormMode::Delete(_)) | None => "",
+                    _ => "",
                 };
                 view! {
                     <Drawer
@@ -730,41 +719,6 @@ pub fn ContextOverride() -> impl IntoView {
                     >
                         <EditorProvider>
                             {match form_mode.get_untracked() {
-                                Some(FormMode::Edit(context_id)) => {
-                                    view! {
-                                        <AutofillForm
-                                            context_id
-                                            dimensions=dimensions
-                                            default_config=default_config
-                                            handle_submit=on_submit
-                                            edit=true
-                                        />
-                                    }
-                                        .into_view()
-                                }
-                                Some(FormMode::Clone(context_id)) => {
-                                    view! {
-                                        <AutofillForm
-                                            context_id
-                                            dimensions
-                                            default_config
-                                            handle_submit=on_submit
-                                        />
-                                    }
-                                        .into_view()
-                                }
-                                Some(FormMode::Create) => {
-                                    view! {
-                                        <Form
-                                            context=Conditions(vec![])
-                                            overrides=vec![]
-                                            dimensions
-                                            default_config
-                                            handle_submit=on_submit
-                                        />
-                                    }
-                                        .into_view()
-                                }
                                 Some(FormMode::Experiment(experiment_type, context_id)) => {
                                     view! {
                                         <AutofillExperimentForm
@@ -777,7 +731,7 @@ pub fn ContextOverride() -> impl IntoView {
                                     }
                                         .into_view()
                                 }
-                                Some(FormMode::Delete(_)) | None => ().into_view(),
+                                _ => ().into_view(),
                             }}
                         </EditorProvider>
                     </Drawer>
@@ -798,13 +752,13 @@ pub fn ContextOverride() -> impl IntoView {
 }
 
 #[derive(Clone)]
-enum ChangeType {
+pub enum ChangeType {
     Delete,
     Update(UpdateRequest),
 }
 
 #[component]
-fn ChangeLogSummary(
+pub fn ChangeLogSummary(
     context_id: String,
     change_type: ChangeType,
     #[prop(into)] on_confirm: Callback<()>,
diff --git a/crates/frontend/src/pages/override_page.rs b/crates/frontend/src/pages/override_page.rs
new file mode 100644
index 000000000..2eb1f411e
--- /dev/null
+++ b/crates/frontend/src/pages/override_page.rs
@@ -0,0 +1,334 @@
+use std::ops::Deref;
+
+use futures::join;
+use leptos::*;
+use leptos_router::use_navigate;
+use serde::{Deserialize, Serialize};
+use serde_json::Value;
+use superposition_types::{
+    api::{default_config::DefaultConfigFilters, dimension::DimensionResponse},
+    custom_query::PaginationParams,
+    database::models::cac::DefaultConfig,
+};
+
+use crate::{
+    api::{default_configs, delete_context, dimensions, get_context},
+    components::{
+        alert::AlertType,
+        button::Button,
+        skeleton::{Skeleton, SkeletonVariant},
+    },
+    logic::Conditions,
+    providers::alert_provider::enqueue_alert,
+    types::{OrganisationId, Workspace},
+};
+
+use super::context_override::{ChangeLogSummary, ChangeType};
+
+/// Page resource for create/edit/detail pages
+#[derive(Serialize, Deserialize, Clone, Debug, Default)]
+struct FormPageResource {
+    dimensions: Vec<DimensionResponse>,
+    default_config: Vec<DefaultConfig>,
+}
+
+/// Detail page for viewing a single override
+#[component]
+pub fn OverridePage() -> impl IntoView {
+    let path_params = leptos_router::use_params_map();
+    let workspace = use_context::<Signal<Workspace>>().unwrap();
+    let org = use_context::<Signal<OrganisationId>>().unwrap();
+    let context_id = Memo::new(move |_| {
+        path_params.with(|params| params.get("context_id").cloned().unwrap_or("1".into()))
+    });
+    let action_rws = RwSignal::new(None::<String>);
+    let delete_inprogress_rws = RwSignal::new(false);
+
+    let context_resource = create_blocking_resource(
+        move || (context_id.get(), workspace.get().0, org.get().0),
+        |(context_id, workspace, org_id)| async move {
+            get_context(&context_id, &workspace, &org_id).await.ok()
+        },
+    );
+
+    let confirm_delete = move |context_id: String| {
+        delete_inprogress_rws.set(true);
+        spawn_local(async move {
+            let result = delete_context(
+                context_id.clone(),
+                &workspace.get_untracked(),
+                &org.get_untracked(),
+            )
+            .await;
+            delete_inprogress_rws.set(false);
+            match result {
+                Ok(_) => {
+                    logging::log!("Context deleted successfully");
+                    let navigate = use_navigate();
+                    let redirect_url = format!(
+                        "/admin/{}/{}/overrides",
+                        org.get().0,
+                        workspace.get().0,
+                    );
+                    navigate(&redirect_url, Default::default());
+                    enqueue_alert(
+                        String::from("Override deleted successfully"),
+                        AlertType::Success,
+                        5000,
+                    );
+                }
+                Err(e) => {
+                    logging::error!("Error deleting context: {:?}", e);
+                    enqueue_alert(e, AlertType::Error, 5000);
+                }
+            }
+        });
+    };
+
+    view! {
+        <Suspense fallback=move || {
+            view! { <Skeleton variant=SkeletonVariant::DetailPage /> }
+        }>
+            {move || {
+                let context = match context_resource.get() {
+                    Some(Some(ctx)) => ctx,
+                    _ => return view! { <h1>"Error fetching override"</h1> }.into_view(),
+                };
+                let context_id = context.id.clone();
+                let override_id = context.override_id.clone();
+                let conditions = Conditions::from_iter(context.value.clone().into_inner());
+                let overrides: Vec<(String, Value)> = context
+                    .override_
+                    .clone()
+                    .into_iter()
+                    .collect();
+                let description = context.description.clone();
+                let change_reason = context.change_reason.deref().to_string();
+                let created_by = context.created_by.clone();
+                let created_at = context.created_at;
+                let last_modified_by = context.last_modified_by.clone();
+                let last_modified_at = context.last_modified_at;
+                let context_id_for_delete = context_id.clone();
+
+                view! {
+                    <div class="flex flex-col gap-4">
+                        <div class="flex justify-between items-center">
+                            <h1 class="text-2xl font-extrabold">"Override"</h1>
+                            <div class="w-full max-w-fit flex flex-row join">
+                                <crate::components::button::ButtonAnchor
+                                    force_style="btn join-item px-5 py-2.5 text-white bg-gradient-to-r from-purple-500 via-purple-600 to-purple-700 shadow-lg rounded-lg"
+                                    href="edit"
+                                    icon_class="ri-edit-line"
+                                    text="Edit"
+                                />
+                                <Button
+                                    force_style="btn join-item px-5 py-2.5 text-white bg-gradient-to-r from-purple-500 via-purple-600 to-purple-700 shadow-lg rounded-lg"
+                                    on_click=move |_| {
+                                        action_rws.set(Some(context_id_for_delete.clone()))
+                                    }
+                                    icon_class="ri-delete-bin-line"
+                                    text="Delete"
+                                />
+                            </div>
+                        </div>
+
+                        <crate::components::context_override_form::OverrideDetailView
+                            context=conditions
+                            overrides=overrides
+                            description=description
+                            override_id=override_id
+                            change_reason=change_reason.clone()
+                            created_by=created_by
+                            created_at=created_at
+                            last_modified_by=last_modified_by
+                            last_modified_at=last_modified_at
+                        />
+                    </div>
+
+                    <Show when=move || action_rws.get().is_some()>
+                        <ChangeLogSummary
+                            context_id=action_rws.get().unwrap_or_default()
+                            change_type=ChangeType::Delete
+                            on_confirm=Callback::new(move |_| {
+                                if let Some(id) = action_rws.get() {
+                                    confirm_delete(id);
+                                }
+                            })
+                            on_close=Callback::new(move |_| action_rws.set(None))
+                            inprogress=Signal::derive(move || delete_inprogress_rws.get())
+                        />
+                    </Show>
+                }
+                    .into_view()
+            }}
+        </Suspense>
+    }
+}
+
+/// Edit page for editing an existing override
+#[component]
+pub fn EditOverride() -> impl IntoView {
+    let path_params = leptos_router::use_params_map();
+    let workspace = use_context::<Signal<Workspace>>().unwrap();
+    let org = use_context::<Signal<OrganisationId>>().unwrap();
+    let context_id = Memo::new(move |_| {
+        path_params.with(|params| params.get("context_id").cloned().unwrap_or("1".into()))
+    });
+
+    let context_resource = create_blocking_resource(
+        move || (context_id.get(), workspace.get().0, org.get().0),
+        |(context_id, workspace, org_id)| async move {
+            get_context(&context_id, &workspace, &org_id).await.ok()
+        },
+    );
+
+    let page_resource: Resource<(String, String), FormPageResource> =
+        create_blocking_resource(
+            move || (workspace.get().0, org.get().0),
+            |(workspace, org_id)| async move {
+                let empty_list_filters = PaginationParams::all_entries();
+                let default_config_filters = DefaultConfigFilters::default();
+                let (dimensions_result, default_config_result) = join!(
+                    dimensions::list(&empty_list_filters, &workspace, &org_id),
+                    default_configs::list(
+                        &empty_list_filters,
+                        &default_config_filters,
+                        &workspace,
+                        &org_id
+                    ),
+                );
+                FormPageResource {
+                    dimensions: dimensions_result.unwrap_or_default().data,
+                    default_config: default_config_result.unwrap_or_default().data,
+                }
+            },
+        );
+
+    view! {
+        <Suspense fallback=move || {
+            view! { <Skeleton variant=SkeletonVariant::DetailPage /> }
+        }>
+            {move || {
+                let context = match context_resource.get() {
+                    Some(Some(ctx)) => ctx,
+                    _ => return view! { <h1>"Error fetching override"</h1> }.into_view(),
+                };
+                let ctx_id = context.id.clone();
+                let conditions = Conditions::from_iter(context.value.clone().into_inner());
+                let overrides: Vec<(String, Value)> = context
+                    .override_
+                    .clone()
+                    .into_iter()
+                    .collect();
+                let description = context.description.deref().to_string();
+                let change_reason = context.change_reason.deref().to_string();
+                let FormPageResource { dimensions, default_config } = page_resource
+                    .get()
+                    .unwrap_or_default();
+                let redirect_url = format!(
+                    "/admin/{}/{}/overrides/{}",
+                    org.get().0,
+                    workspace.get().0,
+                    ctx_id,
+                );
+
+                view! {
+                    <crate::components::context_override_form::ContextOverrideForm
+                        edit=true
+                        context_id=ctx_id
+                        context=conditions
+                        overrides=overrides
+                        dimensions=dimensions
+                        default_config=default_config
+                        description=description
+                        change_reason=change_reason
+                        redirect_url_cancel=redirect_url.clone()
+                        redirect_url_success=redirect_url
+                    />
+                }
+                    .into_view()
+            }}
+        </Suspense>
+    }
+}
+
+/// Create page for creating a new override
+#[component]
+pub fn CreateOverride() -> impl IntoView {
+    let workspace = use_context::<Signal<Workspace>>().unwrap();
+    let org = use_context::<Signal<OrganisationId>>().unwrap();
+    let query = leptos_router::use_query_map();
+    let clone_id = Memo::new(move |_| query.with(|q| q.get("clone").cloned()));
+
+    let clone_context = create_blocking_resource(
+        move || clone_id.get(),
+        move |id| async move {
+            let id = id?;
+            get_context(&id, &workspace.get().0, &org.get().0)
+                .await
+                .ok()
+        },
+    );
+
+    let page_resource = create_blocking_resource(
+        move || (workspace.get().0, org.get().0),
+        |(workspace, org_id)| async move {
+            let empty_list_filters = PaginationParams::all_entries();
+            let default_config_filters = DefaultConfigFilters::default();
+            let (dimensions_result, default_config_result) = join!(
+                dimensions::list(&empty_list_filters, &workspace, &org_id),
+                default_configs::list(
+                    &empty_list_filters,
+                    &default_config_filters,
+                    &workspace,
+                    &org_id
+                ),
+            );
+            FormPageResource {
+                dimensions: dimensions_result.unwrap_or_default().data,
+                default_config: default_config_result.unwrap_or_default().data,
+            }
+        },
+    );
+
+    let redirect_url = store_value(format!(
+        "/admin/{}/{}/overrides",
+        org.get().0,
+        workspace.get().0
+    ));
+
+    view! {
+        <Suspense fallback=move || {
+            view! { <Skeleton variant=SkeletonVariant::DetailPage /> }
+        }>
+            {move || {
+                let FormPageResource { dimensions, default_config } = page_resource
+                    .get()
+                    .unwrap_or_default();
+                let cloned_context = clone_context.get().flatten();
+                let (context, overrides) = match cloned_context {
+                    Some(ctx) => {
+                        (
+                            Conditions::from_iter(ctx.value.clone().into_inner()),
+                            ctx.override_.clone().into_iter().collect::<Vec<_>>(),
+                        )
+                    }
+                    _ => (Conditions(vec![]), vec![]),
+                };
+
+                view! {
+                    <crate::components::context_override_form::ContextOverrideForm
+                        edit=false
+                        context=context
+                        overrides=overrides
+                        dimensions=dimensions
+                        default_config=default_config
+                        redirect_url_cancel=redirect_url.get_value()
+                        redirect_url_success=redirect_url.get_value()
+                    />
+                }
+                    .into_view()
+            }}
+        </Suspense>
+    }
+}