Skip to content

Commit fe514ce

Browse files
AlexVOiceoverAlexVOiceover
committed
refactor: reorganised all file structure
1 parent 5779efc commit fe514ce

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

67 files changed

+1833
-104
lines changed

‎MIGRATION_GUIDE.md

+73
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,73 @@
1+
# Project Structure Migration Guide
2+
3+
## Directory Structure Changes
4+
5+
We've restructured the project to follow a more organized, feature-based architecture. Here's a summary of what changed:
6+
7+
### Feature-based Organization
8+
9+
Files are now organized by feature, with each feature containing its own:
10+
- Components
11+
- Hooks
12+
- Context
13+
- API calls
14+
- Types (when feature-specific)
15+
16+
### New Directory Structure
17+
18+
```
19+
src/
20+
├── assets/ # Images and static assets
21+
├── components/ # Shared UI components
22+
│ ├── ui/ # Base UI components (buttons, inputs, etc.)
23+
│ ├── modals/ # Modal dialogs
24+
│ └── shared/ # Other shared components
25+
├── config/ # Application configuration
26+
├── data/ # Static data files (JSON, etc.)
27+
├── features/ # Feature-specific code
28+
│ ├── auth/ # Authentication feature
29+
│ ├── email/ # Email-related functionality
30+
│ ├── questions/ # Questions management
31+
│ ├── statements/ # Statements management
32+
│ └── wizard/ # Statement wizard feature
33+
├── layouts/ # Layout components
34+
├── lib/ # Shared utilities
35+
│ └── utils/ # Utility functions
36+
├── providers/ # Context providers
37+
├── routes/ # Route definitions
38+
└── types/ # TypeScript type definitions
39+
```
40+
41+
## Import Updates Required
42+
43+
Due to the restructuring, imports in files need to be updated. Here are the general patterns to follow:
44+
45+
### Old vs New Import Paths
46+
47+
| Old Import Path | New Import Path |
48+
|-----------------|-----------------|
49+
| `../components/ui/...` | `../components/ui/...` (unchanged) |
50+
| `../components/Header` | `../layouts/components/Header` |
51+
| `../components/MainPage` | `../layouts/components/MainPage` |
52+
| `../context/AuthContext` | `../features/auth/AuthContext` |
53+
| `../context/AuthProvider` | `../features/auth/AuthProvider` |
54+
| `../context/EntriesContext` | `../features/statements/context/EntriesContext` |
55+
| `../context/EntriesProvider` | `../features/statements/context/EntriesProvider` |
56+
| `../context/QuestionsContext` | `../providers/QuestionsContext` |
57+
| `../context/QuestionsProvider` | `../providers/QuestionsProvider` |
58+
| `../hooks/useAuth` | `../features/auth/hooks/useAuth` |
59+
| `../hooks/useEntries` | `../features/statements/hooks/useEntries` |
60+
| `../hooks/useQuestions` | `../features/questions/hooks/useQuestions` |
61+
| `../api/authApi` | `../features/auth/api/authApi` |
62+
| `../api/entriesApi` | `../features/statements/api/entriesApi` |
63+
| `../api/emailApi` | `../features/email/api/emailApi` |
64+
| `../utils/...` | `../lib/utils/...` |
65+
| `../data/...` | `../data/...` |
66+
67+
## Next Steps
68+
69+
1. Update imports in all files
70+
2. Run tests to ensure the restructuring doesn't break functionality
71+
3. Update build scripts if needed to accommodate the new structure
72+
73+
This restructuring will make the codebase more maintainable, easier to navigate, and better prepared for future growth.

‎README.md

+28-12
Original file line numberDiff line numberDiff line change
@@ -36,18 +36,34 @@ npm install
3636

3737
## Project Structure
3838

39-
The project is organized as follows:
40-
41-
- **src/**: Contains the main source code for the application.
42-
- **components/**: React components used throughout the app.
43-
- **context/**: Context providers for state management.
44-
- **api/**: API calls to the backend.
45-
- **hooks/**: Custom React hooks.
46-
- **lib/**: Utility functions.
47-
- **data/**: JSON files containing static data for the application.
48-
- **public/**: Static files and assets.
49-
- **.github/**: GitHub workflows for CI/CD.
50-
- **dist/**: Build output directory (ignored in version control).
39+
This project follows a feature-based architecture to ensure maintainability and separation of concerns:
40+
41+
```
42+
src/
43+
├── assets/ # Images and static assets
44+
├── components/ # Shared UI components
45+
│ ├── ui/ # Base UI components (buttons, inputs, etc.)
46+
│ ├── modals/ # Modal dialogs
47+
│ └── shared/ # Other shared components
48+
├── config/ # Application configuration
49+
├── data/ # Static data files (JSON, etc.)
50+
├── features/ # Feature-specific code
51+
│ ├── auth/ # Authentication feature
52+
│ ├── email/ # Email-related functionality
53+
│ ├── questions/ # Questions management
54+
│ ├── statements/ # Statements management
55+
│ └── wizard/ # Statement wizard feature
56+
├── layouts/ # Layout components
57+
├── lib/ # Shared utilities
58+
│ └── utils/ # Utility functions
59+
├── providers/ # Context providers
60+
├── routes/ # Route definitions
61+
└── types/ # TypeScript type definitions
62+
```
63+
64+
Each feature has its own directory with components, hooks, context, and API calls, enabling better separation of concerns and improved maintainability.
65+
66+
> See `MIGRATION_GUIDE.md` for details on the project structure organization.
5167
5268
## Development
5369

‎fix_imports.sh

+44
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
#!/bin/bash
2+
3+
# Fix import paths for UI components
4+
find src/features -type f -name "*.tsx" -exec sed -i 's/from "\.\.\/ui\//from "\.\.\/\.\.\/\.\.\/components\/ui\//g' {} \;
5+
find src/features -type f -name "*.tsx" -exec sed -i "s/from '\.\.\/ui\//from '\.\.\/\.\.\/\.\.\/components\/ui\//g" {} \;
6+
7+
# Fix import paths for hooks
8+
find src/features -type f -name "*.ts" -exec sed -i 's/from "\.\.\/hooks\/useEntries"/from "\.\.\/\.\.\/statements\/hooks\/useEntries"/g' {} \;
9+
find src/features -type f -name "*.tsx" -exec sed -i 's/from "\.\.\/hooks\/useEntries"/from "\.\.\/\.\.\/statements\/hooks\/useEntries"/g' {} \;
10+
find src/features -type f -name "*.ts" -exec sed -i "s/from '\.\.\/hooks\/useEntries'/from '\.\.\/\.\.\/statements\/hooks\/useEntries'/g" {} \;
11+
find src/features -type f -name "*.tsx" -exec sed -i "s/from '\.\.\/hooks\/useEntries'/from '\.\.\/\.\.\/statements\/hooks\/useEntries'/g" {} \;
12+
13+
# Fix import paths for statements components
14+
find src/features -type f -name "*.tsx" -exec sed -i 's/from "\.\.\/statements\//from "\.\.\/\.\.\/statements\/components\//g' {} \;
15+
find src/features -type f -name "*.tsx" -exec sed -i "s/from '\.\.\/statements\//from '\.\.\/\.\.\/statements\/components\//g" {} \;
16+
17+
# Fix import paths for wizard components
18+
find src/features -type f -name "*.tsx" -exec sed -i 's/from "\.\.\/statementWizard\//from "\.\.\/\.\.\/wizard\/components\//g' {} \;
19+
find src/features -type f -name "*.tsx" -exec sed -i "s/from '\.\.\/statementWizard\//from '\.\.\/\.\.\/wizard\/components\//g" {} \;
20+
21+
# Fix import paths for utility functions
22+
find src/features -type f -name "*.ts" -exec sed -i 's/from "\.\.\/\.\.\/\.\.\/utils\//from "\.\.\/\.\.\/\.\.\/lib\/utils\//g' {} \;
23+
find src/features -type f -name "*.tsx" -exec sed -i 's/from "\.\.\/\.\.\/\.\.\/utils\//from "\.\.\/\.\.\/\.\.\/lib\/utils\//g' {} \;
24+
find src/features -type f -name "*.ts" -exec sed -i "s/from '\.\.\/\.\.\/\.\.\/utils\//from '\.\.\/\.\.\/\.\.\/lib\/utils\//g" {} \;
25+
find src/features -type f -name "*.tsx" -exec sed -i "s/from '\.\.\/\.\.\/\.\.\/utils\//from '\.\.\/\.\.\/\.\.\/lib\/utils\//g" {} \;
26+
27+
# Fix import paths for types
28+
find src/features -type f -name "*.ts" -exec sed -i 's/from "\.\.\/types\//from "\.\.\/\.\.\/types\//g' {} \;
29+
find src/features -type f -name "*.tsx" -exec sed -i 's/from "\.\.\/types\//from "\.\.\/\.\.\/types\//g' {} \;
30+
find src/features -type f -name "*.ts" -exec sed -i "s/from '\.\.\/types\//from '\.\.\/\.\.\/types\//g" {} \;
31+
find src/features -type f -name "*.tsx" -exec sed -i "s/from '\.\.\/types\//from '\.\.\/\.\.\/types\//g" {} \;
32+
33+
# Fix debugger import
34+
sed -i "s/from '\.\.\/\.\.\/hooks\/useEntries'/from '\.\.\/\.\.\/features\/statements\/hooks\/useEntries'/g" src/components/debug/TestButton.tsx
35+
36+
# Fix specificially for question hooks
37+
find src/features -type f -name "*.ts" -exec sed -i 's/from "\.\/useEntries"/from "\.\.\/\.\.\/statements\/hooks\/useEntries"/g' {} \;
38+
find src/features -type f -name "*.ts" -exec sed -i "s/from '\.\/useEntries'/from '\.\.\/\.\.\/statements\/hooks\/useEntries'/g" {} \;
39+
40+
# Fix context imports for questions
41+
find src/features -type f -name "*.ts" -exec sed -i 's/from "\.\.\/context\/QuestionsContext"/from "\.\.\/\.\.\/providers\/QuestionsContext"/g' {} \;
42+
find src/features -type f -name "*.ts" -exec sed -i "s/from '\.\.\/context\/QuestionsContext'/from '\.\.\/\.\.\/providers\/QuestionsContext'/g" {} \;
43+
44+
echo "Import paths updated. Some manual fixes may still be required."

‎src/App.tsx

+15-9
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,22 @@
11
'use client';
22

33
import React, { useEffect } from 'react';
4-
import { EntriesProvider } from './context/EntriesProvider';
5-
import { AuthProvider } from './context/AuthProvider';
6-
import LoginPage from './components/LoginPage';
7-
import Header from './components/Header';
8-
import MainPage from './components/MainPage';
94
import { TooltipProvider } from '@radix-ui/react-tooltip';
10-
import { useEntries } from './hooks/useEntries';
11-
import { QuestionsProvider } from './context/QuestionsProvider';
12-
import { handleMagicLinkVerification } from './utils/authUtils';
13-
import MockNotification from './components/auth/MockNotification';
5+
6+
// Providers
7+
import { AuthProvider } from './features/auth/AuthProvider';
8+
import { EntriesProvider } from './features/statements/context/EntriesProvider';
9+
import { QuestionsProvider } from './providers/QuestionsProvider';
10+
11+
// Components
12+
import LoginPage from './features/auth/components/LoginPage';
13+
import Header from './layouts/components/Header';
14+
import MainPage from './layouts/components/MainPage';
15+
import MockNotification from './features/auth/components/MockNotification';
16+
17+
// Hooks and Utilities
18+
import { useEntries } from './features/statements/hooks/useEntries';
19+
import { handleMagicLinkVerification } from './features/auth/authUtils';
1420

1521
// Outer Component: Responsible only for setting up the environment (the providers) for the rest of the app.
1622
const AppContent: React.FC = () => {

‎src/components/test/TestButton.tsx ‎src/components/debug/TestButton.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
import React from 'react';
33
import { Button } from '../ui/button';
44
import type { Entry } from '../../../types/entries';
5-
import { useEntries } from '../../hooks/useEntries'; // CHANGE: Import useEntries to update context
5+
import { useEntries } from '../../features/statements/hooks/useEntries'; // CHANGE: Import useEntries to update context
66

77
const TestStatementButton: React.FC = () => {
88
// Create a valid test statement with one sample action.

‎src/components/ShareEmailModal.tsx ‎src/components/modals/ShareEmailModal.tsx

+4-4
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,10 @@ import {
55
Dialog,
66
DialogContent,
77
DialogDescription,
8-
} from '../components/ui/dialog';
9-
import { Button } from '../components/ui/button';
10-
import { useEntries } from '../hooks/useEntries';
11-
import { sendEmail } from '../api/emailApi';
8+
} from '../ui/dialog';
9+
import { Button } from '../ui/button';
10+
import { useEntries } from '../../features/statements/hooks/useEntries';
11+
import { sendEmail } from '../../features/email/api/emailApi';
1212
import { Email } from '../../types/emails';
1313
import { Loader2 } from 'lucide-react';
1414

‎src/components/UserDataModal.tsx ‎src/components/modals/UserDataModal.tsx

+9-9
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,20 @@
11
'use client';
22

33
import React, { useState, useEffect } from 'react';
4-
import { useEntries } from '../hooks/useEntries';
5-
import { useAuth } from '../hooks/useAuth';
4+
import { useEntries } from '../../features/statements/hooks/useEntries';
5+
import { useAuth } from '../../features/auth/hooks/useAuth';
66
import {
77
DialogContent,
88
DialogFooter,
99
DialogDescription,
10-
} from './ui/dialog';
11-
import { Button } from './ui/button';
12-
import { Input } from './ui/input';
10+
} from '../ui/dialog';
11+
import { Button } from '../ui/button';
12+
import { Input } from '../ui/input';
1313
import { Save, X, User, Mail, Award, Edit2, LogOut } from 'lucide-react';
14-
import { Tooltip, TooltipTrigger, TooltipContent } from './ui/tooltip';
15-
import { validateEmail } from '../../utils/validateEmail';
16-
import QuestionCounter from './ui/questionCounter/QuestionCounter';
17-
import LargeCircularQuestionCounter from './ui/questionCounter/LargeCircularQuestionCounter';
14+
import { Tooltip, TooltipTrigger, TooltipContent } from '../ui/tooltip';
15+
import { validateEmail } from '../../lib/utils/validateEmail';
16+
import QuestionCounter from '../ui/questionCounter/QuestionCounter';
17+
import LargeCircularQuestionCounter from '../ui/questionCounter/LargeCircularQuestionCounter';
1818

1919
interface UserDataModalProps {
2020
onOpenChange: (open: boolean) => void;

‎src/components/ui/questionCounter/LargeCircularQuestionCounter.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React from 'react';
2-
import { useAnsweredCount } from '../../../hooks/useAnsweredCount';
2+
import { useAnsweredCount } from '../../../features/questions/hooks/useAnsweredCount';
33

44
interface LargeCircularQuestionCounterProps {
55
size?: number; // default 100px

‎src/components/ui/questionCounter/QuestionCounter.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React from 'react';
2-
import { useAnsweredCount } from '../../../hooks/useAnsweredCount';
2+
import { useAnsweredCount } from '../../../features/questions/hooks/useAnsweredCount';
33
import { cn } from '../../../../lib/utils';
44

55
interface QuestionCounterProps {

‎src/components/ui/questionCounter/smallCircularQuestionCounter.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React from 'react';
2-
import { useAnsweredCount } from '../../../hooks/useAnsweredCount';
2+
import { useAnsweredCount } from '../../../features/questions/hooks/useAnsweredCount';
33

44
interface SmallCircularQuestionCounterProps {
55
size?: number; // default 24px

0 commit comments

Comments
 (0)