review: More cleanup

Author: pulpdrew

packages/app/src/components/AppNav/AppNav.tsx

@@ -665,7 +665,10 @@ export default function AppNav({ fixed = false }: { fixed?: boolean }) {
             {!isCollapsed && (
               <Text size="xs" px="lg" py="xs" fw="lighter" fs="italic">
                 Dashboards have moved! Try the{' '}
-                <Link href="/dashboards">Dashboards page</Link>.
+                <Anchor component={Link} href="/dashboards">
+                  Dashboards page
+                </Anchor>
+                .
               </Text>
             )}
 

packages/app/src/components/Dashboards/DashboardListRow.tsx

@@ -11,10 +11,23 @@ export function DashboardListRow({
   dashboard: Dashboard;
   onDelete: (id: string) => void;
 }) {
+  const href = `/dashboards/${dashboard.id}`;
+
   return (
     <Table.Tr
       style={{ cursor: 'pointer' }}
-      onClick={() => Router.push(`/dashboards/${dashboard.id}`)}
+      onClick={e => {
+        if (e.metaKey || e.ctrlKey) {
+          window.open(href, '_blank');
+        } else {
+          Router.push(href);
+        }
+      }}
+      onAuxClick={e => {
+        if (e.button === 1) {
+          window.open(href, '_blank');
+        }
+      }}
     >
       <Table.Td>
         <Text fw={500} size="sm">

packages/app/src/components/Dashboards/DashboardsListPage.tsx

@@ -6,7 +6,6 @@ import { useQueryState } from 'nuqs';
 import {
   ActionIcon,
   Button,
-  Card,
   Container,
   Flex,
   Group,
@@ -66,7 +65,7 @@ const PRESET_DASHBOARDS = [
 
 export default function DashboardsListPage() {
   const brandName = useBrandDisplayName();
-  const { data: dashboards, isLoading } = useDashboards();
+  const { data: dashboards, isLoading, isError } = useDashboards();
   const confirm = useConfirm();
   const createDashboard = useCreateDashboard();
   const deleteDashboard = useDeleteDashboard();
@@ -108,6 +107,12 @@ export default function DashboardsListPage() {
         onSuccess: data => {
           Router.push(`/dashboards/${data.id}`);
         },
+        onError: () => {
+          notifications.show({
+            message: 'Failed to create dashboard',
+            color: 'red',
+          });
+        },
       },
     );
   }, [createDashboard]);
@@ -223,6 +228,10 @@ export default function DashboardsListPage() {
           <Text size="sm" c="dimmed" ta="center" py="xl">
             Loading dashboards...
           </Text>
+        ) : isError ? (
+          <Text size="sm" c="red" ta="center" py="xl">
+            Failed to load dashboards. Please try refreshing the page.
+          </Text>
         ) : filteredDashboards.length === 0 ? (
           <Stack align="center" gap="sm" py="xl">
             <IconLayoutGrid size={40} opacity={0.3} />