diff --git a/package.json b/package.json index d666d34e..1c65a29f 100644 --- a/package.json +++ b/package.json @@ -82,7 +82,7 @@ "@react-spring/web": "^9.7.3", "@svgr/cli": "^8.1.0", "@tanstack/react-query": "^5.83.0", - "@umami/react-zen": "^0.157.0", + "@umami/react-zen": "^0.162.0", "@umami/redis-client": "^0.27.0", "bcryptjs": "^3.0.2", "chalk": "^5.4.1", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 392dc12b..30e81f4b 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -45,8 +45,8 @@ importers: specifier: ^5.83.0 version: 5.83.0(react@19.1.1) '@umami/react-zen': - specifier: ^0.157.0 - version: 0.157.0(@babel/core@7.27.1)(@types/react@19.1.9)(babel-plugin-react-compiler@19.1.0-rc.2)(immer@9.0.21)(use-sync-external-store@1.5.0(react@19.1.1)) + specifier: ^0.162.0 + version: 0.162.0(@babel/core@7.27.1)(@types/react@19.1.9)(babel-plugin-react-compiler@19.1.0-rc.2)(immer@9.0.21)(use-sync-external-store@1.5.0(react@19.1.1)) '@umami/redis-client': specifier: ^0.27.0 version: 0.27.0 @@ -2547,8 +2547,8 @@ packages: resolution: {integrity: sha512-pWrTcoFNWuwHlA9CvlfSsGWs14JxfN1TH25zM5L7o0pRLhsoZkDnTsXfQRJBEWJoV5DL0jf+Z+sxiud+K0mq1g==} engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0} - '@umami/react-zen@0.157.0': - resolution: {integrity: sha512-QZqZcah1t6KniDvFTF+GxBDkaEYUuQOyj1olao5p5rtZBMW1/v4GaVcL+8UAzWyWIUnsrRI3e5HoytapJg6VfQ==} + '@umami/react-zen@0.162.0': + resolution: {integrity: sha512-pQs5XV6arCjeyWjBBy2rCW2UcWKbq2HjU44iskaV63D88b3sWL6dyx4FnHfJ/0UQv20OJ1gv0qqElB4fva3d8Q==} '@umami/redis-client@0.27.0': resolution: {integrity: sha512-SbHTpxhgeZyTBUSp2zdZM+XUtpsaSL4Tad8QXIEhEtjWhvvfoornyT5kLuyYCVtzSAT4daALeGmOO1z6EE1KcA==} @@ -9873,7 +9873,7 @@ snapshots: '@typescript-eslint/types': 8.38.0 eslint-visitor-keys: 4.2.1 - '@umami/react-zen@0.157.0(@babel/core@7.27.1)(@types/react@19.1.9)(babel-plugin-react-compiler@19.1.0-rc.2)(immer@9.0.21)(use-sync-external-store@1.5.0(react@19.1.1))': + '@umami/react-zen@0.162.0(@babel/core@7.27.1)(@types/react@19.1.9)(babel-plugin-react-compiler@19.1.0-rc.2)(immer@9.0.21)(use-sync-external-store@1.5.0(react@19.1.1))': dependencies: '@fontsource/jetbrains-mono': 5.2.6 '@internationalized/date': 3.8.2 diff --git a/src/app/(main)/SideNav.tsx b/src/app/(main)/SideNav.tsx index 06b0abc9..61bd1cbf 100644 --- a/src/app/(main)/SideNav.tsx +++ b/src/app/(main)/SideNav.tsx @@ -23,7 +23,7 @@ import { PanelButton } from '@/components/input/PanelButton'; export function SideNav(props: SidebarProps) { const { formatMessage, labels } = useMessages(); const { pathname, renderUrl, websiteId } = useNavigation(); - const [isCollapsed] = useGlobalState('sidenav-collapsed'); + let [isCollapsed] = useGlobalState('sidenav-collapsed'); const hasNav = !!( websiteId || @@ -32,19 +32,23 @@ export function SideNav(props: SidebarProps) { pathname.endsWith('/settings') ); + if (hasNav) { + isCollapsed = true; + } + const links = [ - { - id: 'websites', - label: formatMessage(labels.websites), - path: '/websites', - icon: , - }, { id: 'boards', label: formatMessage(labels.boards), path: '/boards', icon: , }, + { + id: 'websites', + label: formatMessage(labels.websites), + path: '/websites', + icon: , + }, { id: 'links', label: formatMessage(labels.links), diff --git a/src/app/(main)/links/LinksPage.tsx b/src/app/(main)/links/LinksPage.tsx new file mode 100644 index 00000000..1b680dd8 --- /dev/null +++ b/src/app/(main)/links/LinksPage.tsx @@ -0,0 +1,24 @@ +'use client'; +import { PageBody } from '@/components/common/PageBody'; +import { Column } from '@umami/react-zen'; +import { PageHeader } from '@/components/common/PageHeader'; +import { BoardAddButton } from '@/app/(main)/boards/BoardAddButton'; +import Link from 'next/link'; +import { useMessages } from '@/components/hooks'; + +export function LinksPage() { + const { formatMessage, labels } = useMessages(); + + return ( + + + + + + + Board 1 + + + + ); +} diff --git a/src/app/(main)/links/page.tsx b/src/app/(main)/links/page.tsx new file mode 100644 index 00000000..ed89c727 --- /dev/null +++ b/src/app/(main)/links/page.tsx @@ -0,0 +1,10 @@ +import { LinksPage } from './LinksPage'; +import { Metadata } from 'next'; + +export default function () { + return ; +} + +export const metadata: Metadata = { + title: 'Links', +}; diff --git a/src/app/(main)/pixels/PixelsPage.tsx b/src/app/(main)/pixels/PixelsPage.tsx new file mode 100644 index 00000000..fa686620 --- /dev/null +++ b/src/app/(main)/pixels/PixelsPage.tsx @@ -0,0 +1,24 @@ +'use client'; +import { PageBody } from '@/components/common/PageBody'; +import { Column } from '@umami/react-zen'; +import { PageHeader } from '@/components/common/PageHeader'; +import { BoardAddButton } from '@/app/(main)/boards/BoardAddButton'; +import Link from 'next/link'; +import { useMessages } from '@/components/hooks'; + +export function PixelsPage() { + const { formatMessage, labels } = useMessages(); + + return ( + + + + + + + Board 1 + + + + ); +} diff --git a/src/app/(main)/pixels/page.tsx b/src/app/(main)/pixels/page.tsx new file mode 100644 index 00000000..4573b065 --- /dev/null +++ b/src/app/(main)/pixels/page.tsx @@ -0,0 +1,10 @@ +import { PixelsPage } from './PixelsPage'; +import { Metadata } from 'next'; + +export default function () { + return ; +} + +export const metadata: Metadata = { + title: 'Pixels', +}; diff --git a/src/components/common/LoadingPanel.tsx b/src/components/common/LoadingPanel.tsx index 177b9898..73208c7d 100644 --- a/src/components/common/LoadingPanel.tsx +++ b/src/components/common/LoadingPanel.tsx @@ -28,9 +28,13 @@ export function LoadingPanel({ const empty = isEmpty ?? checkEmpty(data); return ( - + <> {/* Show loading spinner only if no data exists */} - {(isLoading || isFetching) && !data && } + {(isLoading || isFetching) && !data && ( + + + + )} {/* Show error */} {error && } @@ -40,7 +44,7 @@ export function LoadingPanel({ {/* Show main content when data exists */} {!error && !empty && children} - + ); } diff --git a/src/components/input/TeamsButton.tsx b/src/components/input/TeamsButton.tsx index 6c84493a..c9fd9dd0 100644 --- a/src/components/input/TeamsButton.tsx +++ b/src/components/input/TeamsButton.tsx @@ -25,6 +25,7 @@ export function TeamsButton({ showText = true }: { showText?: boolean }) { const router = useRouter(); const team = data?.data?.find(({ id }) => id === teamId); const selectedKeys = new Set([teamId || user.id]); + const label = teamId ? team?.name : user.username; const handleSelect = (id: Key) => { router.push(id === user.id ? '/websites' : `/teams/${id}/websites`); @@ -37,11 +38,8 @@ export function TeamsButton({ showText = true }: { showText?: boolean }) { return ( - - : } - > + + : }> {showText && (