refactor: organize pages into folders

README.md

@@ -72,8 +72,8 @@ src/
   adminRouteTree.tsx       # admin routes
   components/              # reusable public components
   layouts/                 # public/admin layout shells
-  pages/                   # public pages
-  pages/admin/             # admin pages
+  pages/                   # public pages; one folder per page, e.g. Home/index.tsx
+  pages/admin/             # admin pages; one folder per page, e.g. Resources/index.tsx
   utils/                   # formatting/display helpers
 ```
 

docs/workflow.md

@@ -27,8 +27,8 @@ git pull --ff-only origin main
 
 Use the existing structure:
 
-- Public pages: `src/pages/`
-- Admin pages: `src/pages/admin/`
+- Public pages: `src/pages/<PageName>/index.tsx`
+- Admin pages: `src/pages/admin/<PageName>/index.tsx`
 - Shared components: `src/components/`
 - API helpers/types: `src/api.ts`
 - Translations/copy: `src/i18n.tsx`

src/App.tsx

@@ -4,17 +4,17 @@ import { I18nProvider } from "./i18n";
 import { PublicLayout } from "./layouts/PublicLayout";
 import { Home } from "./pages/Home";
 import { Browse } from "./pages/Browse";
-import { CategoryPage } from "./pages/CategoryPage";
-import { SearchPage } from "./pages/SearchPage";
-import { FavoritesPage } from "./pages/FavoritesPage";
+import { CategoryPage } from "./pages/Category";
+import { SearchPage } from "./pages/Search";
+import { FavoritesPage } from "./pages/Favorites";
 import { ResourceDetail } from "./pages/ResourceDetail";
-import { AboutPage } from "./pages/AboutPage";
+import { AboutPage } from "./pages/About";
 import { adminUiPrefix } from "./adminPaths";
 import { AdminRouteTree } from "./adminRouteTree";
 import { AdminRouterModeProvider } from "./adminRouterMode";
 
 const WalletPage = lazy(() =>
-  import("./pages/WalletPage").then((module) => ({
+  import("./pages/Wallet").then((module) => ({
     default: module.WalletPage,
   })),
 );

src/AppAdminOnly.tsx

@@ -3,11 +3,11 @@ import { I18nProvider } from "./i18n";
 import { adminUiPrefix } from "./adminPaths";
 import { AdminRouterModeProvider } from "./adminRouterMode";
 import { AdminLayout } from "./layouts/AdminLayout";
-import { AdminLogin } from "./pages/admin/AdminLogin";
-import { AdminDashboard } from "./pages/admin/AdminDashboard";
-import { AdminResources } from "./pages/admin/AdminResources";
-import { AdminResourceForm } from "./pages/admin/AdminResourceForm";
-import { AdminSearchLogs } from "./pages/admin/AdminSearchLogs";
+import { AdminLogin } from "./pages/admin/Login";
+import { AdminDashboard } from "./pages/admin/Dashboard";
+import { AdminResources } from "./pages/admin/Resources";
+import { AdminResourceForm } from "./pages/admin/ResourceForm";
+import { AdminSearchLogs } from "./pages/admin/SearchLogs";
 
 function NotFound() {
   return (

src/adminRouteTree.tsx

@@ -1,11 +1,11 @@
 import { Route } from "react-router-dom";
 import { adminUiPrefix } from "./adminPaths";
 import { AdminLayout } from "./layouts/AdminLayout";
-import { AdminLogin } from "./pages/admin/AdminLogin";
-import { AdminDashboard } from "./pages/admin/AdminDashboard";
-import { AdminResources } from "./pages/admin/AdminResources";
-import { AdminResourceForm } from "./pages/admin/AdminResourceForm";
-import { AdminSearchLogs } from "./pages/admin/AdminSearchLogs";
+import { AdminLogin } from "./pages/admin/Login";
+import { AdminDashboard } from "./pages/admin/Dashboard";
+import { AdminResources } from "./pages/admin/Resources";
+import { AdminResourceForm } from "./pages/admin/ResourceForm";
+import { AdminSearchLogs } from "./pages/admin/SearchLogs";
 
 /** Shared between full `App` (when admin enabled) and `AppAdminOnly`. */
 export function AdminRouteTree() {

src/pages/About/index.tsx

@@ -1,4 +1,4 @@
-import { useI18n } from "../i18n";
+import { useI18n } from "../../i18n";
 
 export function AboutPage() {
   const { t } = useI18n();

src/pages/Browse/index.tsx

@@ -1,10 +1,10 @@
 import { useEffect, useMemo, useState } from "react";
 import { useSearchParams } from "react-router-dom";
-import { getJSON, itemsOrEmpty, type Resource } from "../api";
-import { ResourceCard } from "../components/ResourceCard";
-import { ResourceListFooter } from "../components/ResourceListFooter";
-import { useI18n } from "../i18n";
-import { typeFilterLabel } from "../resourceTypeLabels";
+import { getJSON, itemsOrEmpty, type Resource } from "../../api";
+import { ResourceCard } from "../../components/ResourceCard";
+import { ResourceListFooter } from "../../components/ResourceListFooter";
+import { useI18n } from "../../i18n";
+import { typeFilterLabel } from "../../resourceTypeLabels";
 
 const types = [
   "all",

src/pages/Category/index.tsx

@@ -1,10 +1,10 @@
 import { useEffect, useMemo, useState } from "react";
 import { useParams, useSearchParams } from "react-router-dom";
-import { getJSON, itemsOrEmpty, type Category, type Resource } from "../api";
-import { ResourceCard } from "../components/ResourceCard";
-import { ResourceListFooter } from "../components/ResourceListFooter";
-import { useI18n } from "../i18n";
-import { typeFilterLabel } from "../resourceTypeLabels";
+import { getJSON, itemsOrEmpty, type Category, type Resource } from "../../api";
+import { ResourceCard } from "../../components/ResourceCard";
+import { ResourceListFooter } from "../../components/ResourceListFooter";
+import { useI18n } from "../../i18n";
+import { typeFilterLabel } from "../../resourceTypeLabels";
 
 const TYPE_FILTERS = [
   "all",

src/pages/Favorites/index.tsx

@@ -1,8 +1,8 @@
 import { useEffect, useState } from "react";
-import { getJSON, type Resource } from "../api";
-import { ResourceCard } from "../components/ResourceCard";
-import { readFavorites } from "../favorites";
-import { useI18n } from "../i18n";
+import { getJSON, type Resource } from "../../api";
+import { ResourceCard } from "../../components/ResourceCard";
+import { readFavorites } from "../../favorites";
+import { useI18n } from "../../i18n";
 
 export function FavoritesPage() {
   const { t, lang } = useI18n();

src/pages/Home/index.tsx

@@ -1,17 +1,17 @@
 import { ChevronRight } from "lucide-react";
 import { Link } from "react-router-dom";
 import { useEffect, useRef, useState } from "react";
-import { getJSON, itemsOrEmpty, type Category, type Resource } from "../api";
-import { CategoryIcon } from "../components/CategoryIcon";
-import { FigmaBanner } from "../components/FigmaBanner";
+import { getJSON, itemsOrEmpty, type Category, type Resource } from "../../api";
+import { CategoryIcon } from "../../components/CategoryIcon";
+import { FigmaBanner } from "../../components/FigmaBanner";
 import {
   ComingSoonLatestUpdateRow,
   LatestUpdateRow,
-} from "../components/LatestUpdateRow";
-import { RecommendedCard } from "../components/RecommendedCard";
-import { SectionHeader } from "../components/SectionHeader";
-import { useI18n } from "../i18n";
-import { categoryCardLines } from "../utils/categoryDisplay";
+} from "../../components/LatestUpdateRow";
+import { RecommendedCard } from "../../components/RecommendedCard";
+import { SectionHeader } from "../../components/SectionHeader";
+import { useI18n } from "../../i18n";
+import { categoryCardLines } from "../../utils/categoryDisplay";
 
 export function Home() {
   const { t, lang } = useI18n();

src/pages/ResourceDetail/index.tsx

@@ -8,15 +8,15 @@ import {
   postJSON,
   postFavoriteDelta,
   type Resource,
-} from "../api";
+} from "../../api";
 import {
   resourceLanguageLabel,
   resourceTypeLabel,
-} from "../resourceTypeLabels";
-import { ResourceCard } from "../components/ResourceCard";
-import { isFavorite, toggleFavorite } from "../favorites";
-import { useI18n } from "../i18n";
-import { isLikelyVideoPath } from "../video";
+} from "../../resourceTypeLabels";
+import { ResourceCard } from "../../components/ResourceCard";
+import { isFavorite, toggleFavorite } from "../../favorites";
+import { useI18n } from "../../i18n";
+import { isLikelyVideoPath } from "../../video";
 
 export function ResourceDetail() {
   const { id } = useParams();

src/pages/Search/index.tsx

@@ -1,10 +1,10 @@
 import { useEffect, useMemo, useState } from "react";
 import { useSearchParams } from "react-router-dom";
-import { getJSON, itemsOrEmpty, postJSON, type Resource } from "../api";
-import { ResourceCard } from "../components/ResourceCard";
-import { ResourceListFooter } from "../components/ResourceListFooter";
-import { useI18n } from "../i18n";
-import { typeFilterLabel } from "../resourceTypeLabels";
+import { getJSON, itemsOrEmpty, postJSON, type Resource } from "../../api";
+import { ResourceCard } from "../../components/ResourceCard";
+import { ResourceListFooter } from "../../components/ResourceListFooter";
+import { useI18n } from "../../i18n";
+import { typeFilterLabel } from "../../resourceTypeLabels";
 
 const types = [
   "all",

src/pages/Wallet/index.tsx

@@ -1,9 +1,9 @@
 import { RainbowKitProvider, darkTheme } from "@rainbow-me/rainbowkit";
 import { WagmiProvider } from "wagmi";
 import "@rainbow-me/rainbowkit/styles.css";
-import { WalletLoginControls } from "../components/WalletLoginControls";
-import { useI18n } from "../i18n";
-import { wagmiConfig } from "../wagmiConfig";
+import { WalletLoginControls } from "../../components/WalletLoginControls";
+import { useI18n } from "../../i18n";
+import { wagmiConfig } from "../../wagmiConfig";
 
 export function WalletPage() {
   const { t } = useI18n();

src/pages/admin/Dashboard/index.tsx

@@ -1,7 +1,7 @@
 import { useEffect, useState } from "react";
-import { getJSONAuth } from "../../api";
-import { getToken } from "../../admin/token";
-import { useAdminT } from "../../admin/useAdminT";
+import { getJSONAuth } from "../../../api";
+import { getToken } from "../../../admin/token";
+import { useAdminT } from "../../../admin/useAdminT";
 
 type Dash = {
   totalResources: number;

src/pages/admin/Login/index.tsx

@@ -1,10 +1,10 @@
 import { useState } from "react";
 import { useNavigate } from "react-router-dom";
-import { postJSON } from "../../api";
-import { setToken } from "../../admin/token";
-import { useAdminT } from "../../admin/useAdminT";
-import { useAdminRouterMode } from "../../adminRouterMode";
-import { adminUiPrefix } from "../../adminPaths";
+import { postJSON } from "../../../api";
+import { setToken } from "../../../admin/token";
+import { useAdminT } from "../../../admin/useAdminT";
+import { useAdminRouterMode } from "../../../adminRouterMode";
+import { adminUiPrefix } from "../../../adminPaths";
 
 export function AdminLogin() {
   const t = useAdminT();

src/pages/admin/ResourceForm/index.tsx

@@ -7,12 +7,12 @@ import {
   putJSON,
   uploadFile,
   type Category,
-} from "../../api";
-import { getToken } from "../../admin/token";
-import { useAdminT } from "../../admin/useAdminT";
-import { resourceTypeDisplay } from "../../resourceTypeLabels";
-import { adminUiPrefix } from "../../adminPaths";
-import { useAdminRouterMode } from "../../adminRouterMode";
+} from "../../../api";
+import { getToken } from "../../../admin/token";
+import { useAdminT } from "../../../admin/useAdminT";
+import { resourceTypeDisplay } from "../../../resourceTypeLabels";
+import { adminUiPrefix } from "../../../adminPaths";
+import { useAdminRouterMode } from "../../../adminRouterMode";
 
 const types = [
   "image",

src/pages/admin/Resources/index.tsx

@@ -6,12 +6,12 @@ import {
   itemsOrEmpty,
   type AdminResource,
   type Category,
-} from "../../api";
-import { getToken } from "../../admin/token";
-import { resourceTypeDisplay } from "../../resourceTypeLabels";
-import { useAdminT } from "../../admin/useAdminT";
-import { adminUiPrefix } from "../../adminPaths";
-import { useAdminRouterMode } from "../../adminRouterMode";
+} from "../../../api";
+import { getToken } from "../../../admin/token";
+import { resourceTypeDisplay } from "../../../resourceTypeLabels";
+import { useAdminT } from "../../../admin/useAdminT";
+import { adminUiPrefix } from "../../../adminPaths";
+import { useAdminRouterMode } from "../../../adminRouterMode";
 
 function statusLabel(t: (k: string) => string, s: string) {
   if (s === "published") return t("published");

src/pages/admin/SearchLogs/index.tsx

@@ -1,7 +1,7 @@
 import { useEffect, useState } from "react";
-import { getJSONAuth } from "../../api";
-import { getToken } from "../../admin/token";
-import { useAdminT } from "../../admin/useAdminT";
+import { getJSONAuth } from "../../../api";
+import { getToken } from "../../../admin/token";
+import { useAdminT } from "../../../admin/useAdminT";
 
 type Row = { id: number; query: string; createdAt: string };