refactor(components): organize by responsibility

src/components/data/services-list.tsx

@@ -3,7 +3,7 @@
 import { useMemo, useState } from 'react';
 import { buttonVariants } from 'fumadocs-ui/components/ui/button';
 import { SearchIcon } from 'lucide-react';
-import services from '../generated/services.json';
+import services from '../../generated/services.json';
 
 type Service = {
   name: string;

src/components/docs/mdx.tsx

@@ -5,20 +5,12 @@ import { File, Files, Folder } from 'fumadocs-ui/components/files';
 import { Step, Steps } from 'fumadocs-ui/components/steps';
 import type { MDXComponents } from 'mdx/types';
 import type React from 'react';
-import { ChooseYourPath } from './choose-your-path';
-import { CoolActionCard } from './cool-action-card';
-import { CoolActionCardGrid } from './cool-action-card-grid';
-import { CoolCallout } from './cool-callout';
-import { CoolFlow } from './cool-flow';
-import { CoolTable } from './cool-table';
-import { Callout } from './callout';
-import { MediaCard } from './media-card';
-import { MediaCardGroup } from './media-card-group';
-import { ScreenshotTab, ScreenshotTabs } from './screenshot-tabs';
-import { ServicesList } from './services-list';
-import { SponsorsList } from './sponsors-list';
-import { SponsorsPage } from './sponsors-page';
-import { Tab, Tabs } from './tabs';
+import { MediaCard } from '@/components/cards/media-card';
+import { MediaCardGroup } from '@/components/cards/media-card-group';
+import { ServicesList } from '@/components/data/services-list';
+import { SponsorsList } from '@/components/data/sponsors-list';
+import { ChooseYourPath } from '@/components/pages/choose-your-path';
+import { SponsorsPage } from '@/components/pages/sponsors-page';
 import {
   SelfHostedAdvancedOptions,
   SelfHostedFirewallSshBasics,
@@ -30,8 +22,16 @@ import {
   SelfHostedProjectResources,
   SelfHostedRaspberryInstallMethods,
   SelfHostedServerRequirements,
-} from './start-with-self-hosted';
-import { TeamPage } from './team-page';
+} from '@/components/pages/start-with-self-hosted';
+import { TeamPage } from '@/components/pages/team-page';
+import { CoolActionCard } from './cool-action-card';
+import { CoolActionCardGrid } from './cool-action-card-grid';
+import { CoolCallout } from './cool-callout';
+import { CoolFlow } from './cool-flow';
+import { CoolTable } from './cool-table';
+import { Callout } from './callout';
+import { ScreenshotTab, ScreenshotTabs } from './screenshot-tabs';
+import { Tab, Tabs } from './tabs';
 import { ZoomImage } from './zoom-image';
 
 function Badge({ text, children }: { type?: string; text?: string; children?: React.ReactNode }) {

src/components/layout/mobile-header-controls.tsx

@@ -12,7 +12,7 @@ import {
   useSidebar,
 } from 'fumadocs-ui/layouts/notebook/slots/sidebar';
 import { Search3, Sidebar } from 'reicon-react';
-import { ThemeToggle } from '@/components/theme-toggle';
+import { ThemeToggle } from '@/components/layout/theme-toggle';
 import { cn } from '@/lib/cn';
 
 const mobileHeaderButtonClassName =

src/components/pages/sponsors-page.tsx

@@ -1,4 +1,4 @@
-import { SponsorsList } from './sponsors-list';
+import { SponsorsList } from '@/components/data/sponsors-list';
 
 export function SponsorsPage() {
   return (

src/components/pages/start-with-self-hosted.tsx

@@ -3,11 +3,11 @@
 import type React from 'react';
 import { Children, isValidElement, useEffect, useLayoutEffect, useState } from 'react';
 import type { IconComponent } from 'reicon-react';
-import { CoolActionCard } from '@/components/cool-action-card';
-import { CoolActionCardGrid } from '@/components/cool-action-card-grid';
-import { CoolCallout } from '@/components/cool-callout';
-import { CoolFlow } from '@/components/cool-flow';
-import type { CoolActionCardVariant } from '@/components/cool-types';
+import { CoolActionCard } from '@/components/docs/cool-action-card';
+import { CoolActionCardGrid } from '@/components/docs/cool-action-card-grid';
+import { CoolCallout } from '@/components/docs/cool-callout';
+import { CoolFlow } from '@/components/docs/cool-flow';
+import type { CoolActionCardVariant } from '@/components/docs/cool-types';
 import {
   ArrowRight,
   Autobrightness2,

src/lib/layout.shared.tsx

@@ -1,9 +1,9 @@
 import type { BaseLayoutProps } from 'fumadocs-ui/layouts/shared';
 import type { DocsSlots } from 'fumadocs-ui/layouts/notebook';
 import { Cloud } from 'reicon-react';
-import { DiscordInfo, getDiscordInviteUrl } from '@/components/discord-info';
-import { GithubInfo, getGithubRepoUrl } from '@/components/github-info';
-import { mobileSearchTriggerSlots, mobileSidebarSlots } from '@/components/mobile-header-controls';
+import { DiscordInfo, getDiscordInviteUrl } from '@/components/layout/discord-info';
+import { GithubInfo, getGithubRepoUrl } from '@/components/layout/github-info';
+import { mobileSearchTriggerSlots, mobileSidebarSlots } from '@/components/layout/mobile-header-controls';
 import { publicAssetFallbackPath, site } from './site';
 
 type SharedLayoutOptions = BaseLayoutProps & {

src/router.tsx

@@ -1,6 +1,6 @@
 import { createRouter as createTanStackRouter } from '@tanstack/react-router';
 import { routeTree } from './routeTree.gen';
-import { NotFound } from '@/components/not-found';
+import { NotFound } from '@/components/pages/not-found';
 import { site } from '@/lib/site';
 
 export function getRouter() {

src/routes/$.tsx

@@ -4,13 +4,13 @@ import browserCollections from 'collections/browser';
 import type { Root } from 'fumadocs-core/page-tree';
 import { useFumadocsLoader } from 'fumadocs-core/source/client';
 import { Suspense, useMemo, type ReactNode } from 'react';
-import { ClientAPIPage } from '@/components/api-page';
-import { ReiconMarkdownCopyButton } from '@/components/markdown-copy-button';
-import { MobileDrawerHeaderActions } from '@/components/mobile-header-controls';
+import { ClientAPIPage } from '@/components/pages/api-page';
+import { ReiconMarkdownCopyButton } from '@/components/docs/markdown-copy-button';
+import { MobileDrawerHeaderActions } from '@/components/layout/mobile-header-controls';
 import { DocsLayout } from 'fumadocs-ui/layouts/notebook';
 import { DocsBody, DocsPage } from 'fumadocs-ui/layouts/notebook/page';
-import { useMDXComponents } from '@/components/mdx';
-import { ViewOptionsPopover } from '@/components/page-actions';
+import { useMDXComponents } from '@/components/docs/mdx';
+import { ViewOptionsPopover } from '@/components/layout/page-actions';
 import { type DocsManifest, getManifestKey, type LoaderData } from '@/lib/docs-manifest';
 import { createDocsLayoutTabs } from '@/lib/docs-layout-tabs';
 import { baseOptions } from '@/lib/layout.shared';

src/routes/__root.tsx

@@ -1,7 +1,7 @@
 import { createRootRoute, HeadContent, Link, Outlet, Scripts } from '@tanstack/react-router';
 import { RootProvider } from 'fumadocs-ui/provider/tanstack';
 import * as React from 'react';
-import SearchDialog from '@/components/search';
+import SearchDialog from '@/components/layout/search';
 import { absoluteUrl, publicAssetFallbackPath, site } from '@/lib/site';
 import '@/styles/app.css';