Merge pull request #16 from cp-20/chore/update-dependencies

依存関係の更新

Author: cp-20

apps/client/package.json

@@ -9,37 +9,38 @@
     "start": "vite preview --host"
   },
   "dependencies": {
-    "@mantine/core": "^7.11.2",
-    "@mantine/dates": "^7.12.2",
-    "@mantine/hooks": "^7.11.2",
-    "@tabler/icons-react": "^3.11.0",
+    "@mantine/core": "^7.15.1",
+    "@mantine/dates": "^7.15.1",
+    "@mantine/hooks": "^7.15.1",
+    "@tabler/icons-react": "^3.26.0",
     "@tailwindcss/container-queries": "^0.1.1",
     "@traptitech/traq-markdown-it": "^6.3.0",
     "@traq-ing/database": "workspace:*",
     "@traq-ing/server": "workspace:*",
-    "chart.js": "^4.4.3",
+    "chart.js": "^4.4.7",
     "clsx": "^2.1.1",
     "dayjs": "^1.11.13",
     "deepmerge": "^4.3.1",
-    "hono": "^4.5.3",
-    "jotai": "^2.9.1",
+    "hono": "^4.6.14",
+    "jotai": "^2.10.4",
     "react": "^18.3.1",
     "react-chartjs-2": "^5.2.0",
     "react-dom": "^18.3.1",
-    "react-router-dom": "^6.25.1",
+    "react-router": "^7.0.2",
     "swr": "^2.2.5",
-    "vite-tsconfig-paths": "^4.3.2",
-    "traq-bot-ts": "1.4.1"
+    "traq-bot-ts": "1.4.1",
+    "vite-tsconfig-paths": "^5.1.4"
   },
   "devDependencies": {
-    "@types/react": "^18.3.3",
-    "@types/react-dom": "^18.3.0",
-    "@vitejs/plugin-react-swc": "^3.7.0",
-    "autoprefixer": "^10.4.19",
-    "postcss": "^8.4.40",
+    "@react-router/dev": "^7.0.2",
+    "@types/react": "^18.3.18",
+    "@types/react-dom": "^18.3.5",
+    "@vitejs/plugin-react-swc": "^3.7.2",
+    "autoprefixer": "^10.4.20",
+    "postcss": "^8.4.49",
     "postcss-preset-mantine": "^1.17.0",
     "postcss-simple-vars": "^7.0.1",
-    "tailwindcss": "^3.4.7",
-    "vite": "^5.3.5"
+    "tailwindcss": "^3.4.17",
+    "vite": "^6.0.4"
   }
 }

apps/client/src/App.tsx

@@ -1,15 +1,14 @@
 import { NeedLogin } from '@/components/NeedLogin';
 import { RouteAuthGuard } from '@/components/RouteAuthGuard';
-import { router } from '@/pages/router';
+import { AppRouter } from '@/pages/router';
 import { MantineProvider } from '@mantine/core';
 
 import '@mantine/core/styles.css';
-import { RouterProvider } from 'react-router-dom';
 
 const App = () => {
   return (
     <MantineProvider>
-      <RouteAuthGuard component={<RouterProvider router={router} />} fallback={<NeedLogin />} />
+      <RouteAuthGuard component={<AppRouter />} fallback={<NeedLogin />} />
     </MantineProvider>
   );
 };

apps/client/src/components/RouteAuthGuard.tsx

@@ -10,7 +10,7 @@ type Props = {
 };
 
 export const RouteAuthGuard: FC<Props> = ({ component, fallback, loading }) => {
-  const { me, isLoading } = useAuth();
+  const { me, isLoading, isValidating } = useAuth();
 
   return (
     <>
@@ -22,7 +22,7 @@ export const RouteAuthGuard: FC<Props> = ({ component, fallback, loading }) => {
       >
         {loading || <Loader type="bars" size="xl" />}
       </div>
-      {!isLoading && (me ? component : fallback)}
+      {(!isLoading || isValidating) && (me ? component : fallback)}
     </>
   );
 };

apps/client/src/components/containers/Container.tsx

@@ -1,6 +1,6 @@
 import { IconChevronLeft } from '@tabler/icons-react';
 import type { FC, ReactNode } from 'react';
-import { Link } from 'react-router-dom';
+import { Link } from 'react-router';
 
 type ContainerProps = {
   children: ReactNode;

apps/client/src/components/rankings/index.tsx

@@ -1,7 +1,7 @@
 import { Skeleton } from '@mantine/core';
 import { IconCrown } from '@tabler/icons-react';
 import { useEffect, useState, type FC, type ReactNode } from 'react';
-import { Link } from 'react-router-dom';
+import { Link } from 'react-router';
 import clsx from 'clsx';
 
 export type RankingItemSkeletonProps = {

apps/client/src/components/timelines/ChannelActionTimeline.tsx

@@ -34,9 +34,8 @@ export const ChannelActionTimeline: FC<Props> = ({ channelId }) => {
   const { messages } = useMessages(messagesQuery);
   const { stamps } = useStamps(stampsQuery);
 
-  const labels = [...new Set([...messages.map((m) => m.month), ...stamps.map((s) => s.month)]).values()].toSorted(
-    (a, b) => a.localeCompare(b),
-  );
+  const combined = [...messages.map((m) => m.month), ...stamps.map((s) => s.month)];
+  const labels = [...new Set(combined)].sort((a, b) => a.localeCompare(b));
 
   const data = {
     labels,

apps/client/src/components/timelines/TopMessagesTimeline.tsx

@@ -23,7 +23,7 @@ export const TopUserMessagesTimeline: FC = () => {
     [topUsers],
   );
   const { messages } = useMessagesByMultipleQueries(queries);
-  const labels = [...new Set(messages.flatMap((m) => m.map((m) => m.month)))].toSorted((a, b) => a.localeCompare(b));
+  const labels = [...new Set(messages.flatMap((m) => m.map((m) => m.month)))].sort((a, b) => a.localeCompare(b));
   const datasets = messages.map((message, i) => ({
     label: `@${getUsername(topUsers[i])}`,
     data: labels.map((l) => message.filter((m) => m.month <= l).reduce((acc, cur) => acc + cur.count, 0)),
@@ -48,7 +48,7 @@ export const TopChannelMessagesTimeline: FC = () => {
     [topChannels],
   );
   const { messages } = useMessagesByMultipleQueries(queries);
-  const labels = [...new Set(messages.flatMap((m) => m.map((m) => m.month)))].toSorted((a, b) => a.localeCompare(b));
+  const labels = [...new Set(messages.flatMap((m) => m.map((m) => m.month)))].sort((a, b) => a.localeCompare(b));
   const datasets = messages.map((message, i) => ({
     label: `#${getChannelName(topChannels[i])}`,
     data: labels.map((l) => message.filter((m) => m.month <= l).reduce((acc, cur) => acc + cur.count, 0)),

apps/client/src/components/timelines/UserActionTimeline.tsx

@@ -49,7 +49,7 @@ export const UserActionTimeline: FC<UserMessageTimelineProps> = ({ userId }) =>
       ...gaveStamps.map((s) => s.month),
       ...receivedStamps.map((s) => s.month),
     ]).values(),
-  ].toSorted((a, b) => a.localeCompare(b));
+  ].sort((a, b) => a.localeCompare(b));
 
   const data = {
     labels,

apps/client/src/hooks/useAuth.ts

@@ -1,11 +1,11 @@
 import { useMeData } from '@/hooks/useServerData';
 
 export const useAuth = () => {
-  const { data, isLoading } = useMeData();
+  const { data, isLoading, isValidating } = useMeData();
 
   const login = () => {
     location.href = '/api/auth/request';
   };
 
-  return { me: data, isLoading, login };
+  return { me: data, isLoading, isValidating, login };
 };

apps/client/src/pages/channels/ChannelDetailPage.tsx

@@ -4,7 +4,7 @@ import { ChannelDetail } from '@/pages/channels/ChannelDetail';
 import { Loader } from '@mantine/core';
 import clsx from 'clsx';
 import type { FC } from 'react';
-import { Link, useParams } from 'react-router-dom';
+import { Link, useParams } from 'react-router';
 
 export const ChannelDetailPage: FC = () => {
   const { '*': channelName } = useParams<{ '*': string }>();

apps/client/src/pages/channels/ChannelOverviewPage.tsx

@@ -12,7 +12,7 @@ import { useChannels } from '@/hooks/useChannels';
 import { searchChannels } from '@/lib/search';
 import { Skeleton, TextInput } from '@mantine/core';
 import { useState, type FC } from 'react';
-import { Link } from 'react-router-dom';
+import { Link } from 'react-router';
 
 const SearchChannelBlock: FC = () => {
   const [keyword, setKeyword] = useState<string>('');

apps/client/src/pages/dashboard.tsx

@@ -13,7 +13,7 @@ import { StampRanking } from '@/components/rankings/StampRanking';
 import { MessagesUserRanking } from '@/components/rankings/UserRanking';
 import { useDateRangePicker } from '@/composables/useDateRangePicker';
 import type { FC } from 'react';
-import { Link } from 'react-router-dom';
+import { Link } from 'react-router';
 
 export const Dashboard: FC = () => {
   const range = useDateRangePicker('last-7-days');

apps/client/src/pages/groups/GroupDetailPage.tsx

@@ -4,7 +4,7 @@ import { GroupDetail } from '@/pages/groups/GroupDetail';
 import { Loader } from '@mantine/core';
 import clsx from 'clsx';
 import type { FC } from 'react';
-import { Link, useParams } from 'react-router-dom';
+import { Link, useParams } from 'react-router';
 
 export const GroupDetailPage: FC = () => {
   const { groupName } = useParams<{ groupName: string }>();

apps/client/src/pages/groups/GroupOverviewPage.tsx

@@ -6,7 +6,7 @@ import { useGroups } from '@/hooks/useGroups';
 import { searchGroups } from '@/lib/search';
 import { TextInput, Skeleton } from '@mantine/core';
 import { useState, type FC } from 'react';
-import { Link } from 'react-router-dom';
+import { Link } from 'react-router';
 
 const SearchGroupBlock: FC = () => {
   const [keyword, setKeyword] = useState<string>('');

apps/client/src/pages/not-found.tsx

@@ -1,5 +1,5 @@
 import type { FC } from 'react';
-import { Link, useLocation } from 'react-router-dom';
+import { Link, useLocation } from 'react-router';
 
 export const NotFoundPage: FC = () => {
   const location = useLocation();

apps/client/src/pages/playground/PlaygroundResult.tsx

@@ -7,7 +7,7 @@ import { useUsers } from '@/hooks/useUsers';
 import { assert } from '@/lib/invariant';
 import clsx from 'clsx';
 import type { FC, ReactNode } from 'react';
-import { Link } from 'react-router-dom';
+import { Link } from 'react-router';
 
 type RowType = Partial<{
   channel: string;

apps/client/src/pages/router.tsx

@@ -12,21 +12,25 @@ import { SubscriptionSettingsPage } from '@/pages/subscriptions/SubscriptionSett
 import { TagOverviewPage } from '@/pages/tags/TagOverviewPage';
 import { UserDetailPage } from '@/pages/users/UserDetailPage';
 import { UserOverviewPage } from '@/pages/users/UserOverviewPage';
-import { createBrowserRouter } from 'react-router-dom';
+import { BrowserRouter, Routes, Route } from 'react-router';
 
-export const router = createBrowserRouter([
-  { path: '/', element: <Dashboard /> },
-  { path: '/users', element: <UserOverviewPage /> },
-  { path: '/users/:username', element: <UserDetailPage /> },
-  { path: '/channels', element: <ChannelOverviewPage /> },
-  { path: '/channels/*', element: <ChannelDetailPage /> },
-  { path: '/stamps', element: <StampOverviewPage /> },
-  { path: '/stamps/:stampName', element: <StampDetailPage /> },
-  { path: '/messages', element: <MessageOverviewPage /> },
-  { path: '/groups', element: <GroupOverviewPage /> },
-  { path: '/groups/:groupName', element: <GroupDetailPage /> },
-  { path: '/tags', element: <TagOverviewPage /> },
-  { path: '/subscriptions', element: <SubscriptionSettingsPage /> },
-  { path: '/playground', element: <PlaygroundPage /> },
-  { path: '*', element: <NotFoundPage /> },
-]);
+export const AppRouter = () => (
+  <BrowserRouter>
+    <Routes>
+      <Route index element={<Dashboard />} />
+      <Route path="/users" element={<UserOverviewPage />} />
+      <Route path="/users/:username" element={<UserDetailPage />} />
+      <Route path="/channels" element={<ChannelOverviewPage />} />
+      <Route path="/channels/*" element={<ChannelDetailPage />} />
+      <Route path="/stamps" element={<StampOverviewPage />} />
+      <Route path="/stamps/:stampName" element={<StampDetailPage />} />
+      <Route path="/messages" element={<MessageOverviewPage />} />
+      <Route path="/groups" element={<GroupOverviewPage />} />
+      <Route path="/groups/:groupName" element={<GroupDetailPage />} />
+      <Route path="/tags" element={<TagOverviewPage />} />
+      <Route path="/subscriptions" element={<SubscriptionSettingsPage />} />
+      <Route path="/playground" element={<PlaygroundPage />} />
+      <Route path="*" element={<NotFoundPage />} />
+    </Routes>
+  </BrowserRouter>
+);

apps/client/src/pages/stamps/StampDetailPage.tsx

@@ -4,7 +4,7 @@ import { StampDetail } from '@/pages/stamps/StampDetail';
 import { Loader } from '@mantine/core';
 import clsx from 'clsx';
 import type { FC } from 'react';
-import { Link, useParams } from 'react-router-dom';
+import { Link, useParams } from 'react-router';
 
 export const StampDetailPage: FC = () => {
   const { stampName } = useParams<{ stampName: string }>();

apps/client/src/pages/stamps/StampOverViewPage.tsx

@@ -8,7 +8,7 @@ import { useMessageStamps } from '@/hooks/useMessageStamps';
 import { searchStamps } from '@/lib/search';
 import { Skeleton, TextInput } from '@mantine/core';
 import { useState, type FC } from 'react';
-import { Link } from 'react-router-dom';
+import { Link } from 'react-router';
 
 const SearchStampBlock: FC = () => {
   const [keyword, setKeyword] = useState<string>('');

apps/client/src/pages/users/UserDetailPage.tsx

@@ -4,7 +4,7 @@ import { UserDetail } from '@/pages/users/UserDetail';
 import { Loader } from '@mantine/core';
 import clsx from 'clsx';
 import type { FC } from 'react';
-import { Link, useParams } from 'react-router-dom';
+import { Link, useParams } from 'react-router';
 
 export const UserDetailPage: FC = () => {
   const { username } = useParams<{ username: string }>();

apps/client/src/pages/users/UserOverviewPage.tsx

@@ -13,7 +13,7 @@ import { useUsers } from '@/hooks/useUsers';
 import { searchUsers } from '@/lib/search';
 import { Skeleton, TextInput } from '@mantine/core';
 import { useState, type FC } from 'react';
-import { Link } from 'react-router-dom';
+import { Link } from 'react-router';
 
 const SearchUserBlock: FC = () => {
   const [keyword, setKeyword] = useState<string>('');

apps/client/tsconfig.json

@@ -1,8 +1,8 @@
 {
   "compilerOptions": {
-    "target": "ES2020",
+    "target": "ES2021",
     "useDefineForClassFields": true,
-    "lib": ["ES2020", "DOM", "DOM.Iterable"],
+    "lib": ["ES2021", "DOM", "DOM.Iterable"],
     "module": "ESNext",
     "skipLibCheck": true,
 

apps/client/vite.config.ts

@@ -26,4 +26,9 @@ export default defineConfig({
       credentials: true,
     },
   },
+  resolve: {
+    alias: {
+      '@tabler/icons-react': '@tabler/icons-react/dist/esm/icons/index.mjs',
+    },
+  },
 });

apps/react-router.config.ts

@@ -0,0 +1,5 @@
+import type { Config } from '@react-router/dev/config';
+
+export default {
+  ssr: false,
+} satisfies Config;

apps/server/package.json

@@ -18,16 +18,16 @@
     "update-statistics": "bun run ./src/traQ/scripts/update-statistics.ts"
   },
   "dependencies": {
-    "@hono/zod-validator": "^0.2.2",
+    "@hono/zod-validator": "^0.4.2",
     "@traq-ing/database": "workspace:*",
-    "hono": "^4.5.3",
+    "hono": "^4.6.14",
     "js-sha256": "^0.11.0",
     "sharp": "^0.33.5",
     "traq-bot-ts": "1.4.1",
-    "zod": "^3.23.8"
+    "zod": "^3.24.1"
   },
   "devDependencies": {
-    "bun-types": "latest",
-    "drizzle-kit": "^0.23.1"
+    "bun-types": "^1.1.40",
+    "drizzle-kit": "^0.30.1"
   }
 }

bun.lockb

@@ -33,8 +33,8 @@
     "format:check": "biome format ."
   },
   "devDependencies": {
-    "@biomejs/biome": "1.9.2",
+    "@biomejs/biome": "1.9.4",
     "npm-run-all": "^4.1.5",
-    "typescript": "^5.5.4"
+    "typescript": "^5.7.2"
   }
 }

package.json

@@ -13,12 +13,12 @@
     "studio": "drizzle-kit studio --host 0.0.0.0 --port 5000"
   },
   "dependencies": {
-    "drizzle-orm": "0.33.0",
-    "postgres": "3.4.4"
+    "drizzle-orm": "0.38.2",
+    "postgres": "3.4.5"
   },
   "devDependencies": {
-    "bun-types": "latest",
-    "drizzle-kit": "0.24.2",
-    "tsup": "8.3.0"
+    "bun-types": "^1.1.40",
+    "drizzle-kit": "0.30.1",
+    "tsup": "8.3.5"
   }
 }