chore: remove edit mode from notebook scene

PostHog · Sep 11, 2023 · 77c698d · 77c698d
1 parent 3fb024b
commit 77c698d
Show file tree

Hide file tree

Showing 8 changed files with 11 additions and 74 deletions.
diff --git a/cypress/e2e/notebooks.cy.ts b/cypress/e2e/notebooks.cy.ts
@@ -34,7 +34,7 @@ describe('Notebooks', () => {
     })
 
     it('Insertion suggestions can be dismissed', () => {
-        cy.visit(urls.notebookEdit('h11RoiwV'))
+        cy.visit(urls.notebook('h11RoiwV'))
         cy.get('.NotebookEditor').type('{enter}')
 
         cy.get('.NotebookRecordingTimestamp--preview').should('exist')

diff --git a/frontend/src/models/notebooksModel.ts b/frontend/src/models/notebooksModel.ts
@@ -40,7 +40,7 @@ export const openNotebook = async (
     if (popoverLogic?.values.visibility === 'visible') {
         popoverLogic?.actions.selectNotebook(notebookId)
     } else {
-        router.actions.push(urls.notebookEdit(notebookId))
+        router.actions.push(urls.notebook(notebookId))
     }
 
     popoverLogic?.actions.setInitialAutofocus(focus)

diff --git a/frontend/src/scenes/notebooks/Notebook/NotebookPopover.tsx b/frontend/src/scenes/notebooks/Notebook/NotebookPopover.tsx
@@ -45,7 +45,7 @@ export function NotebookPopover(): JSX.Element {
         }
     }, [ref.current])
 
-    const isEditable = visibility !== 'hidden' && !notebook?.is_template
+    const editable = visibility !== 'hidden' && !notebook?.is_template
 
     return (
         <div
@@ -115,7 +115,7 @@ export function NotebookPopover(): JSX.Element {
                         <Notebook
                             key={selectedNotebook}
                             shortId={selectedNotebook}
-                            editable={isEditable}
+                            editable={editable}
                             initialAutofocus={initialAutofocus}
                         />
                     )}

diff --git a/frontend/src/scenes/notebooks/NotebookScene.tsx b/frontend/src/scenes/notebooks/NotebookScene.tsx
@@ -4,7 +4,6 @@ import { notebookLogic } from './Notebook/notebookLogic'
 import { Notebook } from './Notebook/Notebook'
 import { NotFound } from 'lib/components/NotFound'
 import { NotebookSceneLogicProps, notebookSceneLogic } from './notebookSceneLogic'
-import { NotebookMode } from '~/types'
 import { LemonButton, LemonTag } from '@posthog/lemon-ui'
 import { notebookPopoverLogic } from './Notebook/notebookPopoverLogic'
 import { NotebookExpandButton, NotebookSyncInfo } from './Notebook/NotebookMeta'
@@ -32,8 +31,7 @@ export const scene: SceneExport = {
 }
 
 export function NotebookScene(): JSX.Element {
-    const { notebookId, mode } = useValues(notebookSceneLogic)
-    const { setNotebookMode } = useActions(notebookSceneLogic)
+    const { notebookId } = useValues(notebookSceneLogic)
     const { notebook, notebookLoading, conflictWarningVisible } = useValues(notebookLogic({ shortId: notebookId }))
     const { exportJSON } = useActions(notebookLogic({ shortId: notebookId }))
     const { selectNotebook, setVisibility } = useActions(notebookPopoverLogic)
@@ -65,13 +63,13 @@ export function NotebookScene(): JSX.Element {
         )
     }
 
-    const editEnabled = !notebook?.is_template
+    const isTemplate = notebook?.is_template
 
     return (
         <div className="NotebookScene">
             <div className="flex items-center justify-between border-b py-2 mb-2 sticky top-0 bg-bg-3000 z-10">
                 <div className="flex gap-2 items-center">
-                    {notebook?.is_template && <LemonTag type="highlight">TEMPLATE</LemonTag>}
+                    {isTemplate && <LemonTag type="highlight">TEMPLATE</LemonTag>}
                     <UserActivityIndicator at={notebook?.last_modified_at} by={notebook?.last_modified_by} />
                 </div>
 
@@ -89,7 +87,7 @@ export function NotebookScene(): JSX.Element {
                                             exportJSON()
                                         },
                                     },
-                                    editEnabled && {
+                                    !isTemplate && {
                                         label: 'Delete',
                                         icon: <IconDelete />,
                                         status: 'danger',
@@ -135,32 +133,10 @@ export function NotebookScene(): JSX.Element {
                     >
                         Pin to side
                     </LemonButton>
-
-                    {!editEnabled ? null : mode === NotebookMode.Edit ? (
-                        <>
-                            <LemonButton
-                                size={buttonSize}
-                                type="primary"
-                                onClick={() => setNotebookMode(NotebookMode.View)}
-                            >
-                                Done
-                            </LemonButton>
-                        </>
-                    ) : (
-                        <>
-                            <LemonButton
-                                size={buttonSize}
-                                type="primary"
-                                onClick={() => setNotebookMode(NotebookMode.Edit)}
-                            >
-                                Edit
-                            </LemonButton>
-                        </>
-                    )}
                 </div>
             </div>
 
-            <Notebook key={notebookId} shortId={notebookId} editable={editEnabled && mode === NotebookMode.Edit} />
+            <Notebook key={notebookId} shortId={notebookId} editable={!isTemplate} />
         </div>
     )
 }
diff --git a/frontend/src/scenes/notebooks/notebookSceneLogic.ts b/frontend/src/scenes/notebooks/notebookSceneLogic.ts
@@ -1,6 +1,5 @@
-import { actions, afterMount, connect, kea, key, path, props, reducers, selectors } from 'kea'
-import { Breadcrumb, NotebookMode } from '~/types'
-import { actionToUrl, urlToAction } from 'kea-router'
+import { afterMount, connect, kea, key, path, props, selectors } from 'kea'
+import { Breadcrumb } from '~/types'
 
 import type { notebookSceneLogicType } from './notebookSceneLogicType'
 import { notebookLogic } from './Notebook/notebookLogic'
@@ -17,17 +16,6 @@ export const notebookSceneLogic = kea<notebookSceneLogicType>([
         values: [notebookLogic(props), ['notebook', 'notebookLoading']],
         actions: [notebookLogic(props), ['loadNotebook']],
     })),
-    actions({
-        setNotebookMode: (mode: NotebookMode) => ({ mode }),
-    }),
-    reducers({
-        mode: [
-            NotebookMode.View as NotebookMode,
-            {
-                setNotebookMode: (_, { mode }) => mode,
-            },
-        ],
-    }),
     selectors(() => ({
         notebookId: [() => [(_, props) => props], (props): string => props.shortId],
 
@@ -48,26 +36,6 @@ export const notebookSceneLogic = kea<notebookSceneLogicType>([
             ],
         ],
     })),
-    urlToAction(({ props, actions, values }) => ({
-        [`/notebooks/${props.shortId}(/:mode)`]: (
-            { mode } // url params
-        ) => {
-            const newMode = mode === 'edit' ? NotebookMode.Edit : NotebookMode.View
-
-            if (newMode !== values.mode) {
-                actions.setNotebookMode(newMode)
-            }
-        },
-    })),
-    actionToUrl(({ values, props }) => {
-        return {
-            setNotebookMode: () => {
-                return values.mode === NotebookMode.View
-                    ? urls.notebook(props.shortId)
-                    : urls.notebookEdit(props.shortId)
-            },
-        }
-    }),
 
     afterMount(({ actions }) => {
         actions.loadNotebook()

diff --git a/frontend/src/scenes/scenes.ts b/frontend/src/scenes/scenes.ts
@@ -481,5 +481,4 @@ export const routes: Record<string, Scene> = {
     [urls.feedback()]: Scene.Feedback,
     [urls.feedback() + '/*']: Scene.Feedback,
     [urls.notebook(':shortId')]: Scene.Notebook,
-    [urls.notebookEdit(':shortId')]: Scene.Notebook,
 }
diff --git a/frontend/src/scenes/urls.ts b/frontend/src/scenes/urls.ts
@@ -185,5 +185,4 @@ export const urls = {
             tab: 'notebooks',
         }).url,
     notebook: (shortId: string): string => `/notebooks/${shortId}`,
-    notebookEdit: (shortId: string): string => `/notebooks/${shortId}/edit`,
 }
diff --git a/frontend/src/types.ts b/frontend/src/types.ts
@@ -3021,11 +3021,6 @@ export type NotebookType = NotebookListItemType & {
     version: number
 }
 
-export enum NotebookMode {
-    View = 'view',
-    Edit = 'edit',
-}
-
 export enum NotebookNodeType {
     Insight = 'ph-insight',
     Query = 'ph-query',