Merge pull request #49 from ReoHakase/48/refactor-dir-structure

refactor: ♻️ (web) コンポーネントのディレクトリ構造を修正した。  (#48)

apps/web/src/app/[statLabel]/loading.tsx

@@ -1,5 +1,5 @@
 import type { ReactElement } from 'react';
-import { Skeleton } from '@/features/navigation/components/Skeleton/Skeleton';
+import { Skeleton } from '@/components/Skeleton';
 import { PopulationChartSkeleton } from '@/features/population/components/PopulationChart/PopulationChart.skeleton';
 import { css } from 'styled-system/css';
 

apps/web/src/app/[statLabel]/page.tsx

@@ -2,8 +2,7 @@ import type { Metadata } from 'next';
 import type { ReactElement } from 'react';
 import { Suspense } from 'react';
 import { metadata as layoutMetadata, defaultTitle } from '../layout';
-import { PopulationChart } from '@/features/population/components/PopulationChart/PopulationChart';
-import { PopulationChartSkeleton } from '@/features/population/components/PopulationChart/PopulationChart.skeleton';
+import { PopulationChart, PopulationChartSkeleton } from '@/features/population/components/PopulationChart';
 import { fetchPrefectures } from '@/infra/resas/fetchPrefectures';
 import { getGraphPageTitleLocaleJa } from '@/libs/getGraphPageTitleLocale';
 import type { PrefCode } from '@/models/prefCode';

apps/web/src/app/layout.tsx

@@ -1,8 +1,8 @@
 import { Analytics } from '@vercel/analytics/react';
 import type { Metadata, Viewport } from 'next';
 import type { FC, ReactNode } from 'react';
-import { Aurora } from '@/features/landingPage/components/Aurora/Aurora';
-import { Header } from '@/features/navigation/components/Header/Header';
+import { Aurora } from '@/features/decoration/components/Aurora';
+import { Header } from '@/features/navigation/components/Header';
 import { PrefectureForm } from '@/features/navigation/components/PrefectureForm/PrefectureForm';
 import { AppProvider } from '@/providers';
 import { fontVariables } from '@/styles/fonts';

apps/web/src/app/page.tsx

@@ -1,6 +1,6 @@
 import { Building2, ArrowRight, HomeIcon, MapPin } from 'lucide-react';
 import type { ReactNode } from 'react';
-import { Link } from '@/components/Link/Link';
+import { Link } from '@/components/Link';
 import { css } from 'styled-system/css';
 
 const Home = (): ReactNode => {

apps/web/src/components/Chart/index.ts

@@ -0,0 +1,4 @@
+export { Chart } from './Chart';
+export type { ChartProps } from './Chart';
+export { getUniqueLineColor } from './lineColors';
+export type { LineColor } from './lineColors';

apps/web/src/components/Checkbox/index.ts

@@ -0,0 +1,2 @@
+export { Checkbox } from './Checkbox';
+export type { CheckboxProps } from './Checkbox';

apps/web/src/components/Image/index.ts

@@ -0,0 +1,2 @@
+export { Image } from './Image';
+export type { ImageProps, ImageSizeDimension } from './Image';

apps/web/src/components/Link/index.ts

@@ -0,0 +1,2 @@
+export { Link } from './Link';
+export type { LinkProps } from './Link';

apps/web/src/components/Select/index.ts

@@ -0,0 +1,16 @@
+export {
+  Select,
+  SelectGroup,
+  SelectValue,
+  SelectTrigger,
+  SelectIcon,
+  SelectViewport,
+  SelectPortal,
+  SelectContent,
+  SelectItemIndicator,
+  SelectItem,
+  SelectItemText,
+  SelectItemDescription,
+  SelectLabel,
+  SelectSeparator,
+} from './Select';

apps/web/src/components/Skeleton/index.ts

@@ -0,0 +1,2 @@
+export { Skeleton } from './Skeleton';
+export type { SkeletonProps } from './Skeleton';

apps/web/src/features/decoration/components/Aurora/index.ts

@@ -0,0 +1,2 @@
+export { Aurora } from './Aurora';
+export type { AuroraProps } from './Aurora';

apps/web/src/features/navigation/components/Header/Header.tsx

@@ -1,10 +1,10 @@
 import { GithubIcon, Sigma, Baby, PersonStanding, Accessibility } from 'lucide-react';
 import type { ReactNode, ComponentPropsWithoutRef } from 'react';
 import { Suspense } from 'react';
-import { ThemeSelect } from '../ThemeSelect/ThemeSelect';
-import { TopNavigationLink, TopNavigationLinkFallback } from '../TopNavigation/TopNavigationLink';
-import { Image } from '@/components/Image/Image';
-import { Link } from '@/components/Link/Link';
+import { ThemeSelect } from '../ThemeSelect';
+import { TopNavigationLink, TopNavigationLinkFallback } from '../TopNavigation';
+import { Image } from '@/components/Image';
+import { Link } from '@/components/Link';
 import HeaderIconImage from '@public/icon.webp';
 import { css } from 'styled-system/css';
 import { flex } from 'styled-system/patterns';

apps/web/src/features/navigation/components/Header/index.ts

@@ -0,0 +1,2 @@
+export { Header } from './Header';
+export type { HeaderProps } from './Header';

apps/web/src/features/navigation/components/PrefectureCheckbox/PrefectureCheckbox.tsx

@@ -3,8 +3,8 @@
 import { usePathname, useSearchParams, useRouter } from 'next/navigation';
 import { useCallback, useMemo } from 'react';
 import type { ReactNode, ChangeEvent } from 'react';
-import { Checkbox } from '@/components/Checkbox/Checkbox';
-import type { CheckboxProps } from '@/components/Checkbox/Checkbox';
+import { Checkbox } from '@/components/Checkbox';
+import type { CheckboxProps } from '@/components/Checkbox';
 import { prefCodesSchema } from '@/models/prefCode';
 import type { PrefCode } from '@/models/prefCode';
 import { cx } from 'styled-system/css';

apps/web/src/features/navigation/components/PrefectureCheckbox/index.ts

@@ -0,0 +1,2 @@
+export { PrefectureCheckbox } from './PrefectureCheckbox';
+export type { PrefectureCheckboxProps } from './PrefectureCheckbox';

apps/web/src/features/navigation/components/PrefectureCheckboxFieldset/PrefectureCheckboxFieldset.tsx

@@ -1,5 +1,5 @@
 import type { ReactElement, ComponentPropsWithoutRef } from 'react';
-import { PrefectureCheckbox } from '../PrefectureCheckbox/PrefectureCheckbox';
+import { PrefectureCheckbox } from '../PrefectureCheckbox';
 import { fetchPrefectures } from '@/infra/resas/fetchPrefectures';
 import { cx, css } from 'styled-system/css';
 

apps/web/src/features/navigation/components/PrefectureCheckboxFieldset/index.ts

@@ -0,0 +1,2 @@
+export { PrefectureCheckboxFieldset } from './PrefectureCheckboxFieldset';
+export type { PrefectureCheckboxFieldsetProps } from './PrefectureCheckboxFieldset';

apps/web/src/features/navigation/components/PrefectureForm/PrefectureForm.tsx

@@ -1,9 +1,8 @@
 import type { ReactElement, ComponentPropsWithoutRef } from 'react';
 import { Suspense } from 'react';
-import { PrefectureCheckboxFieldset } from '../PrefectureCheckboxFieldset/PrefectureCheckboxFieldset';
-import { PrefectureStateBar } from '@/features/navigation/components/PrefectureStateBar/PrefectureStateBar';
-import { SELECTION_STATE_LABEL_ID } from '@/features/navigation/components/PrefectureStateBar/PrefectureStateBar';
-import { Skeleton } from '@/features/navigation/components/Skeleton/Skeleton';
+import { PrefectureCheckboxFieldset } from '../PrefectureCheckboxFieldset';
+import { PrefectureStateBar, SELECTION_STATE_LABEL_ID } from '../PrefectureStateBar';
+import { Skeleton } from '@/components/Skeleton';
 import { cx, css } from 'styled-system/css';
 
 export type PrefectureFormProps = ComponentPropsWithoutRef<'form'>;

apps/web/src/features/navigation/components/PrefectureStateBar/PrefectureClearButton.tsx

@@ -3,8 +3,8 @@
 import { X } from 'lucide-react';
 import { usePathname } from 'next/navigation';
 import { ReactNode } from 'react';
-import { Link } from '@/components/Link/Link';
-import type { LinkProps } from '@/components/Link/Link';
+import { Link } from '@/components/Link';
+import type { LinkProps } from '@/components/Link';
 import { css, cx } from 'styled-system/css';
 
 export type PrefectureClearButtonProps<T> = Omit<LinkProps<T>, 'href' | 'children'>;

apps/web/src/features/navigation/components/PrefectureStateBar/PrefectureStateBar.tsx

@@ -1,9 +1,9 @@
 import { ArrowDown } from 'lucide-react';
 import { ReactNode, ComponentPropsWithoutRef } from 'react';
 import { Suspense } from 'react';
-import { Skeleton } from '../Skeleton/Skeleton';
 import { PrefectureClearButton } from './PrefectureClearButton';
 import { PrefectureCount } from './PrefectureCount';
+import { Skeleton } from '@/components/Skeleton';
 import { css, cx } from 'styled-system/css';
 
 export const SELECTION_STATE_LABEL_ID = 'selection-state-label' as const;

apps/web/src/features/navigation/components/PrefectureStateBar/index.ts

@@ -0,0 +1,2 @@
+export { PrefectureStateBar, SELECTION_STATE_LABEL_ID } from './PrefectureStateBar';
+export type { PrefectureStateBarProps } from './PrefectureStateBar';

apps/web/src/features/navigation/components/ThemeSelect/ThemeSelect.tsx

@@ -4,7 +4,6 @@ import { Check, Sun, Moon, SwatchBook } from 'lucide-react';
 import { useTheme } from 'next-themes';
 import { forwardRef, useCallback, useEffect, useState } from 'react';
 import type { ElementRef, ComponentPropsWithoutRef } from 'react';
-import { Skeleton } from '../Skeleton/Skeleton';
 import {
   Select,
   SelectGroup,
@@ -17,12 +16,13 @@ import {
   SelectItemText,
   SelectItem,
   SelectLabel,
-} from '@/components/Select/Select';
+} from '@/components/Select';
+import { Skeleton } from '@/components/Skeleton';
 import { css, cx } from 'styled-system/css';
 
 type ThemeValue = 'system' | 'light' | 'dark';
 
-type ThemeSelectProps = ComponentPropsWithoutRef<typeof Select> &
+export type ThemeSelectProps = ComponentPropsWithoutRef<typeof Select> &
   Pick<ComponentPropsWithoutRef<typeof SelectTrigger>, 'className'> &
   Pick<ComponentPropsWithoutRef<typeof SelectPortal>, 'container'>;
 

apps/web/src/features/navigation/components/ThemeSelect/index.ts

@@ -0,0 +1,2 @@
+export { ThemeSelect } from './ThemeSelect';
+export type { ThemeSelectProps } from './ThemeSelect';

apps/web/src/features/navigation/components/TopNavigation/index.ts

@@ -0,0 +1,2 @@
+export { TopNavigationLink, TopNavigationLinkFallback } from './TopNavigationLink';
+export type { TopNavigationLinkProps } from './TopNavigationLink';

apps/web/src/features/population/components/PopulationChart/PopulationChart.tsx

@@ -1,8 +1,7 @@
 import type { ReactElement } from 'react';
 import type { ComponentPropsWithoutRef } from 'react';
-import { Chart } from '@/components/Chart/Chart';
-import type { ChartProps } from '@/components/Chart/Chart';
-import { getUniqueLineColor } from '@/components/Chart/lineColors';
+import type { ChartProps } from '@/components/Chart';
+import { Chart, getUniqueLineColor } from '@/components/Chart';
 import { fetchPrefectures } from '@/infra/resas/fetchPrefectures';
 import { extractDataPointsByStatLabel } from '@/libs/extractDataPointsByStatLabel';
 import { getPopulationCompositionAll } from '@/libs/getPopulationCompositionAll';

apps/web/src/features/population/components/PopulationChart/index.ts

@@ -0,0 +1,3 @@
+export { PopulationChart } from './PopulationChart';
+export type { PopulationChartProps } from './PopulationChart';
+export { PopulationChartSkeleton } from './PopulationChart.skeleton';