border around filter bar as you can come back to dashboard in edit mode

PostHog · Sep 4, 2024 · 0951d00 · 0951d00
1 parent e64b83d
commit 0951d00
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 4 deletions.
diff --git a/frontend/src/lib/components/Cards/InsightCard/InsightMeta.tsx b/frontend/src/lib/components/Cards/InsightCard/InsightMeta.tsx
@@ -140,7 +140,7 @@ export function InsightMeta({
             moreButtons={
                 <>
                     <>
-                        <LemonButton to={urls.insightView(short_id)} fullWidth>
+                        <LemonButton to={urls.insightView(short_id, filtersOverride)} fullWidth>
                             View
                         </LemonButton>
                         {refresh && (

diff --git a/frontend/src/scenes/dashboard/DashboardEditBar.tsx b/frontend/src/scenes/dashboard/DashboardEditBar.tsx
@@ -1,4 +1,5 @@
 import { IconCalendar } from '@posthog/icons'
+import clsx from 'clsx'
 import { useActions, useValues } from 'kea'
 import { DateFilter } from 'lib/components/DateFilter/DateFilter'
 import { PropertyFilters } from 'lib/components/PropertyFilters/PropertyFilters'
@@ -16,7 +17,14 @@ export function DashboardEditBar(): JSX.Element {
     const disabledReason = !canEditDashboard ? "You don't have permission to edit this dashboard" : undefined
 
     return (
-        <div className="flex gap-2 items-center justify-between flex-wrap">
+        <div
+            className={clsx(
+                'flex gap-2 items-center justify-between flex-wrap border',
+                dashboardMode === DashboardMode.Edit
+                    ? '-m-1.5 p-1.5 border-border-bold border-dashed rounded-lg'
+                    : 'border-transparent'
+            )}
+        >
             <DateFilter
                 showCustom
                 dateFrom={temporaryFilters.date_from}

diff --git a/frontend/src/scenes/dashboard/dashboardLogic.tsx b/frontend/src/scenes/dashboard/dashboardLogic.tsx
@@ -1322,7 +1322,6 @@ export const dashboardLogic = kea<dashboardLogicType>([
         '/dashboard/:id': () => {
             actions.setSubscriptionMode(false, undefined)
             actions.setTextTileId(null)
-            actions.setDashboardMode(null, DashboardEventSource.Browser)
         },
         '/dashboard/:id/sharing': () => {
             actions.setSubscriptionMode(false, undefined)

diff --git a/frontend/src/scenes/urls.ts b/frontend/src/scenes/urls.ts
@@ -91,7 +91,11 @@ export const urls = {
         ).url,
     insightEdit: (id: InsightShortId): string => `/insights/${id}/edit`,
     insightView: (id: InsightShortId, filtersOverride?: DashboardFilter): string =>
-        `/insights/${id}${filtersOverride !== undefined ? `?filters_override=${JSON.stringify(filtersOverride)}` : ''}`,
+        `/insights/${id}${
+            filtersOverride !== undefined
+                ? `?filters_override=${encodeURIComponent(JSON.stringify(filtersOverride))}`
+                : ''
+        }`,
     insightSubcriptions: (id: InsightShortId): string => `/insights/${id}/subscriptions`,
     insightSubcription: (id: InsightShortId, subscriptionId: string): string =>
         `/insights/${id}/subscriptions/${subscriptionId}`,