Skip to content

Commit b4be10a

Browse files
authored
feat: Update environment configuration and enhance UI components (#91)
* feat: Update environment configuration and enhance UI components - Added NEXT_PUBLIC_APP_URL to environment.example for frontend configuration. - Updated email service domain and sender email in environment.example for consistency. - Introduced @radix-ui/react-tabs package for improved tab functionality in UI. - Refactored AdminLoginPage to utilize AdminLoginModal for better user experience. - Removed deprecated login page and integrated authentication modals across landing components. - Enhanced styling in globals.css for consistent design tokens and improved accessibility. - Updated button styles in ui/button.tsx for better visual feedback. - Implemented new AuthModal component for user authentication across landing pages. * feat: Implement password reset functionality - Added ResetPasswordPage component for users to reset their passwords using a token. - Enhanced AuthModal to include a "Forgot password?" link that opens a modal for email input. - Implemented forgotPassword and resetPassword functions in auth library for handling password reset requests. - Created PasswordResetTemplate for sending password reset emails. - Updated database schema to include password reset token and expiration fields. - Added API endpoints for forgot password and reset password functionalities in the backend. * chore: Add formatting and linting configuration for code consistency - Introduced .prettierrc files for backend, frontend, and email service to standardize code formatting. - Created .prettierignore to exclude unnecessary files from formatting. - Added formatting scripts in package.json for frontend and email service. - Implemented a format-all.sh script to run formatters across all services. - Established a comprehensive FORMATTING.md guide for developers on code formatting and linting practices. * chore: Remove FORMATTING.md and update GitHub Actions for linting and formatting - Deleted FORMATTING.md as its content is now integrated into the CI/CD pipeline. - Updated GitHub Actions workflow to include permissions for writing to pull requests. - Modified commit messages in the workflow to skip CI for auto-formatting commits. - Adjusted Dockerfile.prod to install dependencies without forcing production mode. - Updated .dockerignore to exclude additional files and directories. * chore: Update GitHub Actions for linting and formatting with new actions - Replaced manual formatting steps with GitHub Action integrations for Black and Prettier. - Simplified the workflow by removing unnecessary steps and conditions for running formatters. - Ensured consistent auto-formatting for backend, frontend, and email service components. * style(email-service): auto-format with prettier [skip ci] * chore: Add lint and format checks to GitHub Actions workflows - Introduced a lint-check job to ensure code quality before builds for backend, frontend, and email service. - Integrated Black for Python code formatting and Prettier for JavaScript/TypeScript formatting. - Set up pnpm for dependency management in the lint-check process. - Ensured that the build jobs depend on successful lint checks to maintain code standards. * chore: Add CI/CD pipeline documentation and auto-formatting steps - Introduced comprehensive CI/CD pipeline documentation outlining the flow from PR to deployment. - Added auto-formatting steps in GitHub Actions workflows for backend, frontend, and email service. - Updated workflows to ensure code is automatically formatted before builds, enhancing code quality and consistency. - Simplified manual lint-and-format workflow to serve as an optional trigger for quick fixes. * chore: Update GitHub Actions to use npx for formatting and commit changes - Replaced GitHub Action Prettier integration with npx commands for formatting in frontend and email service. - Added a step to commit and push formatting changes automatically if any modifications are detected. - Ensured consistent code formatting across services as part of the CI/CD pipeline. * chore: Update GitHub Actions to use pnpm for Prettier formatting - Replaced npx commands with pnpm exec for running Prettier in both deploy-preview and deploy-production workflows. - Ensured consistent usage of pnpm for dependency management across formatting steps in GitHub Actions. * chore: Remove lint and format steps from GitHub Actions workflows - Eliminated the lint and format jobs from both deploy-preview and deploy-production workflows to streamline the CI/CD process. - Updated build job dependencies to reflect the removal of formatting steps, ensuring a more efficient build pipeline. --------- Co-authored-by: geeth24 <geeth24@users.noreply.github.com>
1 parent c11f486 commit b4be10a

Some content is hidden

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

64 files changed

+3156
-996
lines changed
Lines changed: 105 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,105 @@
1+
name: Lint and Format (Manual Trigger)
2+
3+
# This workflow is for manual formatting only
4+
# Deployments automatically format code, so this is optional
5+
on:
6+
workflow_dispatch: # Manual trigger only
7+
push:
8+
branches:
9+
- main
10+
- develop
11+
paths:
12+
- 'server/**/*.py'
13+
- 'client/**/*.{ts,tsx,js,jsx,mjs}'
14+
- 'email-service/**/*.{ts,tsx,js}'
15+
16+
permissions:
17+
contents: write
18+
pull-requests: write
19+
20+
jobs:
21+
# Backend Python formatting and linting
22+
format-backend:
23+
name: Format & Lint Backend (Python)
24+
runs-on: ubuntu-latest
25+
26+
steps:
27+
- name: Check out repository
28+
uses: actions/checkout@v4
29+
with:
30+
ref: ${{ github.head_ref }}
31+
32+
- name: Format with Black
33+
uses: psf/black@stable
34+
with:
35+
options: "--line-length 88 --preview"
36+
src: "./server"
37+
38+
# Frontend formatting and linting
39+
format-frontend:
40+
name: Format & Lint Frontend (Next.js)
41+
runs-on: ubuntu-latest
42+
43+
steps:
44+
- name: Check out repository
45+
uses: actions/checkout@v4
46+
with:
47+
ref: ${{ github.head_ref }}
48+
49+
- name: Set up pnpm
50+
uses: pnpm/action-setup@v4
51+
with:
52+
version: 10
53+
54+
- name: Set up Node.js
55+
uses: actions/setup-node@v4
56+
with:
57+
node-version: '24'
58+
cache: 'pnpm'
59+
cache-dependency-path: 'client/pnpm-lock.yaml'
60+
61+
- name: Install dependencies
62+
working-directory: ./client
63+
run: pnpm install --frozen-lockfile
64+
65+
- name: Format with Prettier
66+
uses: creyD/prettier_action@v4.3
67+
with:
68+
prettier_options: --write "client/**/*.{ts,tsx,js,jsx,mjs,json,css}"
69+
commit_message: "style(frontend): auto-format with prettier [skip ci]"
70+
only_changed: false
71+
72+
# Email Service formatting and linting
73+
format-email-service:
74+
name: Format & Lint Email Service (TypeScript)
75+
runs-on: ubuntu-latest
76+
77+
steps:
78+
- name: Check out repository
79+
uses: actions/checkout@v4
80+
with:
81+
ref: ${{ github.head_ref }}
82+
83+
- name: Set up pnpm
84+
uses: pnpm/action-setup@v4
85+
with:
86+
version: 10
87+
88+
- name: Set up Node.js
89+
uses: actions/setup-node@v4
90+
with:
91+
node-version: '24'
92+
cache: 'pnpm'
93+
cache-dependency-path: 'email-service/pnpm-lock.yaml'
94+
95+
- name: Install dependencies
96+
working-directory: ./email-service
97+
run: pnpm install --frozen-lockfile
98+
99+
- name: Format with Prettier
100+
uses: creyD/prettier_action@v4.3
101+
with:
102+
prettier_options: --write "email-service/**/*.{ts,tsx,js}"
103+
commit_message: "style(email-service): auto-format with prettier [skip ci]"
104+
only_changed: false
105+

.prettierignore

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
# Dependencies
2+
node_modules
3+
**/node_modules
4+
5+
# Build outputs
6+
.next
7+
out
8+
dist
9+
build
10+
*.pyc
11+
__pycache__
12+
13+
# Logs
14+
*.log
15+
npm-debug.log*
16+
17+
# Lock files
18+
pnpm-lock.yaml
19+
package-lock.json
20+
yarn.lock
21+
22+
# Environment files
23+
.env
24+
.env.*
25+
26+
# IDE
27+
.vscode
28+
.idea
29+
30+
# Git
31+
.git
32+
33+
# Python
34+
*.py
35+
__pycache__
36+
*.pyc
37+
.venv
38+
venv
39+
40+
# Misc
41+
.DS_Store
42+
coverage
43+
.turbo
44+

.prettierrc

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
{
2+
"semi": true,
3+
"trailingComma": "all",
4+
"singleQuote": true,
5+
"printWidth": 100,
6+
"tabWidth": 2,
7+
"useTabs": false,
8+
"arrowParens": "always",
9+
"endOfLine": "lf",
10+
"plugins": ["prettier-plugin-tailwindcss"]
11+
}
12+

CI-CD-PIPELINE.md

Lines changed: 225 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,225 @@
1+
# CI/CD Pipeline Documentation
2+
3+
## 🚀 Pipeline Flow
4+
5+
```
6+
┌──────────────────────────────────────────────────────────┐
7+
│ PR or Push to Main │
8+
└────────────────────┬─────────────────────────────────────┘
9+
10+
11+
┌──────────────────────────────────────────────────────────┐
12+
│ Step 1: Setup & Version │
13+
│ • Predict version bump (preview) │
14+
│ • Auto-bump version (production) │
15+
│ • Generate image tags │
16+
└────────────────────┬─────────────────────────────────────┘
17+
18+
19+
┌──────────────────────────────────────────────────────────┐
20+
│ Step 2: Lint & Format ✨ NEW! │
21+
│ • Auto-format Python with Black │
22+
│ • Auto-format TypeScript/React with Prettier │
23+
│ • Commit changes back to branch [skip ci] │
24+
│ ⚠️ If formatting fails, pipeline stops here │
25+
└────────────────────┬─────────────────────────────────────┘
26+
27+
28+
┌──────────────────────────────────────────────────────────┐
29+
│ Step 3: Build Docker Images (Matrix) │
30+
│ • Backend (Python/FastAPI) │
31+
│ • Frontend (Next.js) │
32+
│ • Email Service (Node.js/Express) │
33+
│ • Push to registry │
34+
└────────────────────┬─────────────────────────────────────┘
35+
36+
37+
┌──────────────────────────────────────────────────────────┐
38+
│ Step 4: Deploy to Kubernetes │
39+
│ • Helm upgrade with new image tags │
40+
│ • Update environment variables │
41+
│ • Wait for rollout │
42+
└────────────────────┬─────────────────────────────────────┘
43+
44+
45+
┌──────────────────────────────────────────────────────────┐
46+
│ Step 5: Notify (Preview Only) │
47+
│ • Comment on PR with deployment URLs │
48+
│ • Show version prediction │
49+
│ • Include auth instructions │
50+
└──────────────────────────────────────────────────────────┘
51+
```
52+
53+
## 📋 Workflows
54+
55+
### 1. `deploy-preview.yml` (Pull Requests)
56+
57+
**Triggers:** When PR is opened, synchronized, or reopened
58+
59+
**Jobs:**
60+
1. **setup** - Predicts version bump and generates environment variables
61+
2. **lint-format** ✨ - Auto-formats code before building
62+
3. **build** - Builds and pushes Docker images (matrix: backend, frontend, email-service)
63+
4. **deploy** - Deploys to Kubernetes with preview subdomain
64+
5. **deploy-preview** - Final status check and notification
65+
66+
**Preview URLs:**
67+
- Frontend: `https://{branch-name}.private.bluerelief.app`
68+
- Backend: `https://api-{branch-name}.private.bluerelief.app`
69+
- Email Service: `https://email-api-{branch-name}.private.bluerelief.app`
70+
71+
### 2. `deploy-production.yml` (Main Branch)
72+
73+
**Triggers:** Push to `main` branch
74+
75+
**Jobs:**
76+
1. **version** - Auto-bumps version based on commit messages
77+
2. **lint-format** ✨ - Auto-formats code before building
78+
3. **build** - Builds and pushes Docker images with version tags
79+
4. **deploy** - Deploys to production Kubernetes cluster
80+
81+
**Version Bumping:**
82+
- `BREAKING CHANGE` or `breaking:` → Major (1.0.0 → 2.0.0)
83+
- `feat:` or `feature:` → Minor (1.0.0 → 1.1.0)
84+
- `fix:`, `chore:`, `docs:` → Patch (1.0.0 → 1.0.1)
85+
86+
### 3. `lint-and-format.yml` (Manual/Optional)
87+
88+
**Triggers:** Manual trigger or push to main/develop (no PRs)
89+
90+
**Purpose:** Standalone formatting workflow for quick fixes
91+
92+
**Note:** This is now optional since deployments auto-format code
93+
94+
### 4. `cleanup-preview.yml`
95+
96+
**Triggers:** When PR is closed or merged
97+
98+
**Purpose:** Removes preview deployments from Kubernetes
99+
100+
## ✨ New: Auto-Formatting in Pipeline
101+
102+
### What Changed?
103+
104+
**Before:** Code had to be manually formatted locally before pushing
105+
106+
**After:** CI automatically formats code before building
107+
108+
### How It Works
109+
110+
1. **Checkout code** from your branch
111+
2. **Run formatters:**
112+
- Backend: `black --line-length 88 --preview ./server`
113+
- Frontend: `prettier --write "client/**/*.{ts,tsx,js,jsx,mjs,json,css}"`
114+
- Email Service: `prettier --write "email-service/**/*.{ts,tsx,js}"`
115+
3. **Commit changes** back to your branch with `[skip ci]` tag
116+
4. **Continue to build** with properly formatted code
117+
118+
### Benefits
119+
120+
✅ No more "code not formatted" errors blocking deployments
121+
✅ Consistent code style across all services
122+
✅ Developers don't need to remember to run formatters locally
123+
✅ Fast feedback - formatting happens in ~30 seconds
124+
125+
## 🔧 Local Development
126+
127+
### Format Code Locally (Optional but Recommended)
128+
129+
```bash
130+
# All services at once
131+
./scripts/format-all.sh
132+
133+
# Individual services
134+
cd client && pnpm format
135+
cd server && black . && isort . && ruff check --fix .
136+
cd email-service && pnpm format
137+
```
138+
139+
### Check Status Before Pushing
140+
141+
```bash
142+
# Frontend
143+
cd client && pnpm format:check
144+
145+
# Backend
146+
cd server && black --check .
147+
148+
# Email Service
149+
cd email-service && pnpm format:check
150+
```
151+
152+
## 📊 CI/CD Checks You'll See
153+
154+
When you create or update a PR:
155+
156+
```
157+
✓ setup (Generates version and tags)
158+
✓ lint-format (Auto-formats code) ✨ NEW!
159+
✓ build (backend) (Builds Python Docker image)
160+
✓ build (frontend) (Builds Next.js Docker image)
161+
✓ build (email-service) (Builds Node Docker image)
162+
✓ deploy (Deploys to K8s preview)
163+
✓ deploy-preview (Final status check)
164+
✓ label-pr (Auto-labels based on changes)
165+
```
166+
167+
## 🎯 Configuration Files
168+
169+
### Prettier (TypeScript/JavaScript)
170+
- `.prettierrc` (root, client, email-service)
171+
- Single quotes, trailing commas, 100 char width
172+
- Tailwind CSS class sorting (frontend only)
173+
174+
### Black (Python)
175+
- `pyproject.toml`
176+
- 88 char line length, Python 3.13 target
177+
- Preview features enabled
178+
179+
### Docker
180+
- `client/Dockerfile.prod` - Next.js production build
181+
- `server/Dockerfile.prod` - FastAPI production build
182+
- `email-service/Dockerfile` - Express production build
183+
184+
## 🚨 Troubleshooting
185+
186+
### "Formatting failed" error
187+
188+
**Cause:** Syntax error in code prevents formatter from running
189+
190+
**Solution:** Fix the syntax error locally and push again
191+
192+
### Build fails after formatting
193+
194+
**Cause:** Formatted code introduced a linter error (rare)
195+
196+
**Solution:** Check the build logs, fix locally, push again
197+
198+
### Deployment hangs
199+
200+
**Cause:** Kubernetes resources not ready
201+
202+
**Solution:** Check Helm status: `helm status bluerelief-{branch-name} -n bluerelief`
203+
204+
## 💡 Best Practices
205+
206+
1. **Let CI format for you** - Don't worry about running formatters locally
207+
2. **Review auto-commits** - Check the formatting changes CI makes
208+
3. **Use semantic commits** - Controls version bumping (`feat:`, `fix:`, etc.)
209+
4. **Test in preview** - Always test your changes in the preview deployment
210+
5. **Keep PRs focused** - Smaller PRs = faster reviews and deployments
211+
212+
## 🔗 Related Files
213+
214+
- `.prettierrc` - Prettier configuration
215+
- `pyproject.toml` - Python tool configuration
216+
- `scripts/format-all.sh` - Local formatting script
217+
- `.github/workflows/` - All CI/CD workflows
218+
219+
## 📚 Additional Resources
220+
221+
- [Black Documentation](https://black.readthedocs.io/)
222+
- [Prettier Documentation](https://prettier.io/)
223+
- [Conventional Commits](https://www.conventionalcommits.org/)
224+
- [Helm Charts](https://helm.sh/)
225+

client/.dockerignore

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,3 +11,8 @@ dist
1111
.env.production.local
1212
.DS_Store
1313
*.log
14+
.git
15+
.gitignore
16+
README.md
17+
.vscode
18+
.idea

0 commit comments

Comments
 (0)