From b6e126c3311dfc60029397fd43e82a86833d71b6 Mon Sep 17 00:00:00 2001 From: Jordi Enric <37541088+jordienr@users.noreply.github.com> Date: Thu, 20 Feb 2025 07:42:01 +0100 Subject: [PATCH] Feat: remember last visited route in logs FE-1418 (#33486) * add logic to remember last route * add default redirect * move logic to index page * Simplify logs page redirect logic * missing } * fix wrong } * wait 2s for page to redirect * use latest version in local studio cli test * rm timeouts looks like it takes longer in ci * Clean up * Fix broken commands --------- Co-authored-by: Joshen Lim --- .github/workflows/studio-e2e-tests.yml | 2 + .../layouts/LogsLayout/LogsLayout.tsx | 38 ++++++++++++++----- .../layouts/LogsLayout/LogsSidebarMenuV2.tsx | 9 +++-- .../NavigationBar/NavigationBar.utils.tsx | 2 +- apps/studio/lib/constants/index.ts | 3 ++ .../studio/pages/project/[ref]/logs/index.tsx | 33 ++++++++++++++++ package.json | 2 +- tests/studio-tests/package.json | 2 + 8 files changed, 75 insertions(+), 16 deletions(-) create mode 100644 apps/studio/pages/project/[ref]/logs/index.tsx diff --git a/.github/workflows/studio-e2e-tests.yml b/.github/workflows/studio-e2e-tests.yml index ec79edae963..163c42dbe01 100644 --- a/.github/workflows/studio-e2e-tests.yml +++ b/.github/workflows/studio-e2e-tests.yml @@ -35,6 +35,8 @@ jobs: node-version-file: '.nvmrc' cache: 'pnpm' - uses: supabase/setup-cli@v1 + with: + version: latest - name: Install dependencies run: pnpm i - name: Install Playwright Browsers diff --git a/apps/studio/components/layouts/LogsLayout/LogsLayout.tsx b/apps/studio/components/layouts/LogsLayout/LogsLayout.tsx index ad231063ca4..fe549556727 100644 --- a/apps/studio/components/layouts/LogsLayout/LogsLayout.tsx +++ b/apps/studio/components/layouts/LogsLayout/LogsLayout.tsx @@ -1,9 +1,12 @@ import { PermissionAction } from '@supabase/shared-types/out/constants' -import { PropsWithChildren } from 'react' +import { useRouter } from 'next/router' +import { PropsWithChildren, useEffect } from 'react' import NoPermission from 'components/ui/NoPermission' import { useAsyncCheckProjectPermissions } from 'hooks/misc/useCheckPermissions' +import { useLocalStorageQuery } from 'hooks/misc/useLocalStorage' import { withAuth } from 'hooks/misc/withAuth' +import { LOCAL_STORAGE_KEYS } from 'lib/constants' import ProjectLayout from '../ProjectLayout/ProjectLayout' import { LogsSidebarMenuV2 } from './LogsSidebarMenuV2' @@ -17,16 +20,31 @@ const LogsLayout = ({ title, children }: PropsWithChildren) => 'logflare' ) - if (isLoading) { - return - } + const router = useRouter() + const [_, setLastLogsPage] = useLocalStorageQuery( + LOCAL_STORAGE_KEYS.LAST_VISITED_LOGS_PAGE, + router.pathname.split('/').pop() + ) - if (!isLoading && !canUseLogsExplorer) { - return ( - - - - ) + useEffect(() => { + if (router.pathname.includes('/logs/')) { + const path = router.pathname.split('/').pop() + setLastLogsPage(path) + } + }, [router, setLastLogsPage]) + + if (!canUseLogsExplorer) { + if (isLoading) { + return + } + + if (!isLoading && !canUseLogsExplorer) { + return ( + + + + ) + } } return ( diff --git a/apps/studio/components/layouts/LogsLayout/LogsSidebarMenuV2.tsx b/apps/studio/components/layouts/LogsLayout/LogsSidebarMenuV2.tsx index 7bc1a15dc3d..161ddb886a8 100644 --- a/apps/studio/components/layouts/LogsLayout/LogsSidebarMenuV2.tsx +++ b/apps/studio/components/layouts/LogsLayout/LogsSidebarMenuV2.tsx @@ -1,4 +1,9 @@ import { PermissionAction } from '@supabase/shared-types/out/constants' +import { ChevronRight, FilePlus, Plus } from 'lucide-react' +import Link from 'next/link' +import { useRouter } from 'next/router' +import { useState } from 'react' + import { IS_PLATFORM, useParams } from 'common' import { CreateWarehouseCollectionModal } from 'components/interfaces/DataWarehouse/CreateWarehouseCollection' import { WarehouseMenuItem } from 'components/interfaces/DataWarehouse/WarehouseMenuItem' @@ -10,10 +15,6 @@ import { useContentQuery } from 'data/content/content-query' import { useCheckPermissions } from 'hooks/misc/useCheckPermissions' import { useIsFeatureEnabled } from 'hooks/misc/useIsFeatureEnabled' import { useFlag } from 'hooks/ui/useFlag' -import { ChevronRight, FilePlus, Plus } from 'lucide-react' -import Link from 'next/link' -import { useRouter } from 'next/router' -import { useState } from 'react' import { Button, Collapsible_Shadcn_, diff --git a/apps/studio/components/layouts/ProjectLayout/NavigationBar/NavigationBar.utils.tsx b/apps/studio/components/layouts/ProjectLayout/NavigationBar/NavigationBar.utils.tsx index d55afbd075c..16eedb4530e 100644 --- a/apps/studio/components/layouts/ProjectLayout/NavigationBar/NavigationBar.utils.tsx +++ b/apps/studio/components/layouts/ProjectLayout/NavigationBar/NavigationBar.utils.tsx @@ -133,7 +133,7 @@ export const generateOtherRoutes = (ref?: string, project?: Project): Route[] => key: 'logs', label: 'Logs', icon: , - link: ref && (isProjectBuilding ? buildingUrl : `/project/${ref}/logs/explorer`), + link: ref && (isProjectBuilding ? buildingUrl : `/project/${ref}/logs`), }, { key: 'api', diff --git a/apps/studio/lib/constants/index.ts b/apps/studio/lib/constants/index.ts index de927eebe22..022ca4c31fb 100644 --- a/apps/studio/lib/constants/index.ts +++ b/apps/studio/lib/constants/index.ts @@ -93,6 +93,9 @@ export const LOCAL_STORAGE_KEYS = { // api keys view switcher for new and legacy api keys API_KEYS_VIEW: (ref: string) => `supabase-api-keys-view-${ref}`, + + // last visited logs page + LAST_VISITED_LOGS_PAGE: 'supabase-last-visited-logs-page', } export const OPT_IN_TAGS = { diff --git a/apps/studio/pages/project/[ref]/logs/index.tsx b/apps/studio/pages/project/[ref]/logs/index.tsx new file mode 100644 index 00000000000..cfb40aea392 --- /dev/null +++ b/apps/studio/pages/project/[ref]/logs/index.tsx @@ -0,0 +1,33 @@ +import { useRouter } from 'next/router' +import { useEffect } from 'react' + +import { useParams } from 'common' +import DefaultLayout from 'components/layouts/DefaultLayout' +import LogsLayout from 'components/layouts/LogsLayout/LogsLayout' +import { useLocalStorageQuery } from 'hooks/misc/useLocalStorage' +import { LOCAL_STORAGE_KEYS } from 'lib/constants' +import type { NextPageWithLayout } from 'types' + +export const LogPage: NextPageWithLayout = () => { + const router = useRouter() + const { ref } = useParams() + + const [lastVisitedLogsPage] = useLocalStorageQuery( + LOCAL_STORAGE_KEYS.LAST_VISITED_LOGS_PAGE, + 'explorer' + ) + + useEffect(() => { + router.replace(`/project/${ref}/logs/${lastVisitedLogsPage}`) + }, [router, lastVisitedLogsPage, ref]) + + return null +} + +LogPage.getLayout = (page) => ( + + {page} + +) + +export default LogPage diff --git a/package.json b/package.json index 483cc362ea7..7b1d9ff7a85 100644 --- a/package.json +++ b/package.json @@ -15,7 +15,7 @@ "dev": "turbo run dev --parallel", "dev:reference": "turbo run dev --filter=reference --parallel", "dev:studio": "turbo run dev --filter=studio --parallel", - "dev:studio-local": "pnpm run --dir tests/local-studio-tests codegen:setup", + "dev:studio-local": "pnpm run --dir tests/studio-tests codegen:setup", "dev:docs": "turbo run dev --filter=docs --parallel", "dev:www": "turbo run dev --filter=www --parallel", "dev:design-system": "turbo run dev --filter=design-system --parallel", diff --git a/tests/studio-tests/package.json b/tests/studio-tests/package.json index e15ee220a07..b96c92fd6aa 100644 --- a/tests/studio-tests/package.json +++ b/tests/studio-tests/package.json @@ -10,6 +10,8 @@ "test:local": "pnpm env:setup && export ENV=local && export PROJECT_REF=default && playwright test", "posttest:local": "supabase stop --no-backup", "test:staging": "export ENV=staging && playwright test", + "codegen:setup": "pnpm env:setup && NODE_ENV=test pnpm --prefix ../../apps/studio dev", + "codegen": "playwright codegen http://localhost:8082/project/default", "clean": "rimraf node_modules" }, "keywords": [],