chore: cleanup

Author: ImLunaHey

src/components/PostEmbed.tsx

@@ -60,14 +60,16 @@ export const PostEmbed = ({ embed }: { embed?: BSkyPostEmbed | null }) => {
           <a href={embed.external.uri} target="_blank" rel="noreferrer" className="hover:underline">
             {embed.external.title}
           </a>
-          <Image
-            type="post"
-            src={embed.external.uri ?? embed.external.thumb}
-            alt={embed.external.title}
-            classNames={{
-              image: 'rounded-lg w-full aspect-square object-cover',
-            }}
-          />
+          {!!embed.external.thumb && (
+            <Image
+              type="post"
+              src={embed.external.thumb}
+              alt={embed.external.title}
+              classNames={{
+                image: 'rounded-lg w-full aspect-square object-cover',
+              }}
+            />
+          )}
         </div>
       );
     case 'app.bsky.embed.record#view': {

src/components/ui/Image.tsx

@@ -33,7 +33,12 @@ export const Image = ({ src, alt, type, classNames, ...props }: ImageProps) => {
 
   if (!src) {
     return (
-      <div className="bg-neutral-200 dark:bg-neutral-600 text-black dark:text-white text-center aspect-square justify-center items-center flex">
+      <div
+        className={cn(
+          'bg-neutral-200 dark:bg-neutral-600 text-black dark:text-white text-center aspect-square justify-center items-center flex',
+          classNames?.image,
+        )}
+      >
         <span>{t('noImage')}</span>
       </div>
     );

src/routeTree.gen.ts

@@ -13,7 +13,6 @@ import { createFileRoute } from '@tanstack/react-router'
 // Import Routes
 
 import { Route as rootRoute } from './routes/__root'
-import { Route as NotificationsImport } from './routes/notifications'
 import { Route as MessagesIndexImport } from './routes/messages/index'
 import { Route as MessagesConvoIdImport } from './routes/messages/$convoId'
 import { Route as ProfileHandleIndexImport } from './routes/profile/$handle/index'
@@ -22,6 +21,7 @@ import { Route as ProfileHandlePostPostIdImport } from './routes/profile/$handle
 // Create Virtual Routes
 
 const SettingsLazyImport = createFileRoute('/settings')()
+const NotificationsLazyImport = createFileRoute('/notifications')()
 const LoginLazyImport = createFileRoute('/login')()
 const IndexLazyImport = createFileRoute('/')()
 const TagTagLazyImport = createFileRoute('/tag/$tag')()
@@ -34,18 +34,18 @@ const SettingsLazyRoute = SettingsLazyImport.update({
   getParentRoute: () => rootRoute,
 } as any).lazy(() => import('./routes/settings.lazy').then((d) => d.Route))
 
+const NotificationsLazyRoute = NotificationsLazyImport.update({
+  id: '/notifications',
+  path: '/notifications',
+  getParentRoute: () => rootRoute,
+} as any).lazy(() => import('./routes/notifications.lazy').then((d) => d.Route))
+
 const LoginLazyRoute = LoginLazyImport.update({
   id: '/login',
   path: '/login',
   getParentRoute: () => rootRoute,
 } as any).lazy(() => import('./routes/login.lazy').then((d) => d.Route))
 
-const NotificationsRoute = NotificationsImport.update({
-  id: '/notifications',
-  path: '/notifications',
-  getParentRoute: () => rootRoute,
-} as any)
-
 const IndexLazyRoute = IndexLazyImport.update({
   id: '/',
   path: '/',
@@ -93,20 +93,20 @@ declare module '@tanstack/react-router' {
       preLoaderRoute: typeof IndexLazyImport
       parentRoute: typeof rootRoute
     }
-    '/notifications': {
-      id: '/notifications'
-      path: '/notifications'
-      fullPath: '/notifications'
-      preLoaderRoute: typeof NotificationsImport
-      parentRoute: typeof rootRoute
-    }
     '/login': {
       id: '/login'
       path: '/login'
       fullPath: '/login'
       preLoaderRoute: typeof LoginLazyImport
       parentRoute: typeof rootRoute
     }
+    '/notifications': {
+      id: '/notifications'
+      path: '/notifications'
+      fullPath: '/notifications'
+      preLoaderRoute: typeof NotificationsLazyImport
+      parentRoute: typeof rootRoute
+    }
     '/settings': {
       id: '/settings'
       path: '/settings'
@@ -156,8 +156,8 @@ declare module '@tanstack/react-router' {
 
 export interface FileRoutesByFullPath {
   '/': typeof IndexLazyRoute
-  '/notifications': typeof NotificationsRoute
   '/login': typeof LoginLazyRoute
+  '/notifications': typeof NotificationsLazyRoute
   '/settings': typeof SettingsLazyRoute
   '/messages/$convoId': typeof MessagesConvoIdRoute
   '/tag/$tag': typeof TagTagLazyRoute
@@ -168,8 +168,8 @@ export interface FileRoutesByFullPath {
 
 export interface FileRoutesByTo {
   '/': typeof IndexLazyRoute
-  '/notifications': typeof NotificationsRoute
   '/login': typeof LoginLazyRoute
+  '/notifications': typeof NotificationsLazyRoute
   '/settings': typeof SettingsLazyRoute
   '/messages/$convoId': typeof MessagesConvoIdRoute
   '/tag/$tag': typeof TagTagLazyRoute
@@ -181,8 +181,8 @@ export interface FileRoutesByTo {
 export interface FileRoutesById {
   __root__: typeof rootRoute
   '/': typeof IndexLazyRoute
-  '/notifications': typeof NotificationsRoute
   '/login': typeof LoginLazyRoute
+  '/notifications': typeof NotificationsLazyRoute
   '/settings': typeof SettingsLazyRoute
   '/messages/$convoId': typeof MessagesConvoIdRoute
   '/tag/$tag': typeof TagTagLazyRoute
@@ -195,8 +195,8 @@ export interface FileRouteTypes {
   fileRoutesByFullPath: FileRoutesByFullPath
   fullPaths:
     | '/'
-    | '/notifications'
     | '/login'
+    | '/notifications'
     | '/settings'
     | '/messages/$convoId'
     | '/tag/$tag'
@@ -206,8 +206,8 @@ export interface FileRouteTypes {
   fileRoutesByTo: FileRoutesByTo
   to:
     | '/'
-    | '/notifications'
     | '/login'
+    | '/notifications'
     | '/settings'
     | '/messages/$convoId'
     | '/tag/$tag'
@@ -217,8 +217,8 @@ export interface FileRouteTypes {
   id:
     | '__root__'
     | '/'
-    | '/notifications'
     | '/login'
+    | '/notifications'
     | '/settings'
     | '/messages/$convoId'
     | '/tag/$tag'
@@ -230,8 +230,8 @@ export interface FileRouteTypes {
 
 export interface RootRouteChildren {
   IndexLazyRoute: typeof IndexLazyRoute
-  NotificationsRoute: typeof NotificationsRoute
   LoginLazyRoute: typeof LoginLazyRoute
+  NotificationsLazyRoute: typeof NotificationsLazyRoute
   SettingsLazyRoute: typeof SettingsLazyRoute
   MessagesConvoIdRoute: typeof MessagesConvoIdRoute
   TagTagLazyRoute: typeof TagTagLazyRoute
@@ -242,8 +242,8 @@ export interface RootRouteChildren {
 
 const rootRouteChildren: RootRouteChildren = {
   IndexLazyRoute: IndexLazyRoute,
-  NotificationsRoute: NotificationsRoute,
   LoginLazyRoute: LoginLazyRoute,
+  NotificationsLazyRoute: NotificationsLazyRoute,
   SettingsLazyRoute: SettingsLazyRoute,
   MessagesConvoIdRoute: MessagesConvoIdRoute,
   TagTagLazyRoute: TagTagLazyRoute,
@@ -263,8 +263,8 @@ export const routeTree = rootRoute
       "filePath": "__root.tsx",
       "children": [
         "/",
-        "/notifications",
         "/login",
+        "/notifications",
         "/settings",
         "/messages/$convoId",
         "/tag/$tag",
@@ -276,12 +276,12 @@ export const routeTree = rootRoute
     "/": {
       "filePath": "index.lazy.tsx"
     },
-    "/notifications": {
-      "filePath": "notifications.tsx"
-    },
     "/login": {
       "filePath": "login.lazy.tsx"
     },
+    "/notifications": {
+      "filePath": "notifications.lazy.tsx"
+    },
     "/settings": {
       "filePath": "settings.lazy.tsx"
     },

src/routes/notifications.tsx renamed to src/routes/notifications.lazy.tsx

@@ -1,5 +1,5 @@
 import * as Ariakit from '@ariakit/react';
-import { createFileRoute } from '@tanstack/react-router';
+import { createLazyFileRoute } from '@tanstack/react-router';
 import { useTranslation } from 'react-i18next';
 import { useNotifications } from '../lib/bluesky/hooks/useNotifications';
 import { Debug } from '../components/ui/Debug';
@@ -13,7 +13,7 @@ import { Handle } from '../components/ui/Handle';
 import { Virtuoso } from 'react-virtuoso';
 import { Button } from '../components/ui/Button';
 
-export const Route = createFileRoute('/notifications')({
+export const Route = createLazyFileRoute('/notifications')({
   component: RouteComponent,
 });
 
@@ -83,7 +83,7 @@ function RouteComponent() {
 
 // group notifications by uri
 function GroupedNotifications() {
-  const { t } = useTranslation('notifications');
+  const { t } = useTranslation(['app', 'notifications']);
   const { data, isLoading, fetchNextPage, isFetching } = useNotifications();
   const notifications = data?.pages.flatMap((page) => page.notifications);
   if (!notifications) return null;