Francy51/Neon-Desk
2
0
Fork 0
Code Issues 22 Pull Requests Actions Packages Projects Releases Wiki Activity

fix: Update Tailwind CSS and Better Auth imports for frontend build

Browse Source 
- Update Tailwind CSS v4 PostCSS configuration
- Fix Better Auth React imports (better-auth/react)
- Update all page components to use Better Auth useSession
- Add @tailwindcss/postcss to dependencies
- Remove SessionProvider from layout (Better Auth handles sessions)
- Fix globals.css for Tailwind v4 compatibility
- Update page components with correct session state checking

This addresses build failures related to:
- Tailwind CSS v4 PostCSS plugin compatibility
- Better Auth React client import paths
- NextAuth v5 to Better Auth migration
This commit is contained in:
Francesco
2026-02-21 02:09:11 +00:00
parent 517db95126
commit 7df3d54103
9 changed files with 3725 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
frontend/app/filings/page.tsx
View File

@@ -1,20 +1,20 @@
'use client'; 'use client';
import { useSession } from 'next-auth/react'; import { useSession } from '@/lib/better-auth';
import { useRouter } from 'next/navigation'; import { useRouter } from 'next/navigation';
import { useEffect, useState } from 'react'; import { useEffect, useState } from 'react';
import Link from 'next/link'; import Link from 'next/link';
import { format } from 'date-fns'; import { format } from 'date-fns';
export default function FilingsPage() { export default function FilingsPage() {
const { data: session, status } = useSession(); const { data: session, isPending } = useSession();
const router = useRouter(); const router = useRouter();
const [filings, setFilings] = useState([]); const [filings, setFilings] = useState([]);
const [loading, setLoading] = useState(true); const [loading, setLoading] = useState(true);
const [searchTicker, setSearchTicker] = useState(''); const [searchTicker, setSearchTicker] = useState('');
useEffect(() => { useEffect(() => {
if (status === 'unauthenticated') { if (!isPending && !session) {
router.push('/auth/signin'); router.push('/auth/signin');
return; return;
} }
@@ -22,7 +22,7 @@ export default function FilingsPage() {
if (session?.user) { if (session?.user) {
fetchFilings(); fetchFilings();
} }
}, [session, status, router]); }, [session, isPending, router]);
const fetchFilings = async (ticker?: string) => { const fetchFilings = async (ticker?: string) => {
setLoading(true); setLoading(true);

6
frontend/app/globals.css
View File

@@ -6,14 +6,16 @@
:root { :root {
--background: 222.2 84% 4.9%; --background: 222.2 84% 4.9%;
--foreground: 210 40% 98%; --foreground: 210 40% 98%;
--border: 217.2 32.6% 17.5%;
} }
} }
@layer base { @layer base {
* { * {
@apply border-border; border-color: hsl(var(--border));
} }
body { body {
@apply bg-background text-foreground; background-color: hsl(var(--background));
color: hsl(var(--foreground));
} }
} }

5
frontend/app/layout.tsx
View File

@@ -1,6 +1,3 @@
'use client';
import { SessionProvider } from 'next-auth/react';
import './globals.css'; import './globals.css';
export default function RootLayout({ export default function RootLayout({
@@ -11,9 +8,7 @@ export default function RootLayout({
return ( return (
<html lang="en"> <html lang="en">
<body> <body>
<SessionProvider>
{children} {children}
</SessionProvider>
</body> </body>
</html> </html>
) )

8
frontend/app/page.tsx
View File

@@ -1,17 +1,17 @@
'use client'; 'use client';
import { useSession } from 'next-auth/react'; import { useSession } from '@/lib/better-auth';
import { useRouter } from 'next/navigation'; import { useRouter } from 'next/navigation';
import { useEffect, useState } from 'react'; import { useEffect, useState } from 'react';
import Link from 'next/link'; import Link from 'next/link';
export default function Home() { export default function Home() {
const { data: session, status } = useSession(); const { data: session, isPending } = useSession();
const router = useRouter(); const router = useRouter();
const [stats, setStats] = useState({ filings: 0, portfolioValue: 0, watchlist: 0 }); const [stats, setStats] = useState({ filings: 0, portfolioValue: 0, watchlist: 0 });
useEffect(() => { useEffect(() => {
if (status === 'unauthenticated') { if (!isPending && !session) {
router.push('/auth/signin'); router.push('/auth/signin');
return; return;
} }
@@ -19,7 +19,7 @@ export default function Home() {
if (session?.user) { if (session?.user) {
fetchStats(session.user.id); fetchStats(session.user.id);
} }
}, [session, status, router]); }, [session, isPending, router]);
const fetchStats = async (userId: string) => { const fetchStats = async (userId: string) => {
try { try {

8
frontend/app/portfolio/page.tsx
View File

@@ -1,6 +1,6 @@
'use client'; 'use client';
import { useSession } from 'next-auth/react'; import { useSession } from '@/lib/better-auth';
import { useRouter } from 'next/navigation'; import { useRouter } from 'next/navigation';
import { useEffect, useState } from 'react'; import { useEffect, useState } from 'react';
import { LineChart, Line, XAxis, YAxis, CartesianGrid, Tooltip, ResponsiveContainer, PieChart, Pie, Cell, Legend } from 'recharts'; import { LineChart, Line, XAxis, YAxis, CartesianGrid, Tooltip, ResponsiveContainer, PieChart, Pie, Cell, Legend } from 'recharts';
@@ -8,7 +8,7 @@ import { format } from 'date-fns';
import Link from 'next/link'; import Link from 'next/link';
export default function PortfolioPage() { export default function PortfolioPage() {
const { data: session, status } = useSession(); const { data: session, isPending } = useSession();
const router = useRouter(); const router = useRouter();
const [portfolio, setPortfolio] = useState([]); const [portfolio, setPortfolio] = useState([]);
const [summary, setSummary] = useState({ total_value: 0, total_gain_loss: 0, cost_basis: 0 }); const [summary, setSummary] = useState({ total_value: 0, total_gain_loss: 0, cost_basis: 0 });
@@ -17,7 +17,7 @@ export default function PortfolioPage() {
const [newHolding, setNewHolding] = useState({ ticker: '', shares: '', avg_cost: '' }); const [newHolding, setNewHolding] = useState({ ticker: '', shares: '', avg_cost: '' });
useEffect(() => { useEffect(() => {
if (status === 'unauthenticated') { if (!isPending && !session) {
router.push('/auth/signin'); router.push('/auth/signin');
return; return;
} }
@@ -25,7 +25,7 @@ export default function PortfolioPage() {
if (session?.user) { if (session?.user) {
fetchPortfolio(session.user.id); fetchPortfolio(session.user.id);
} }
}, [session, status, router]); }, [session, isPending, router]);
const fetchPortfolio = async (userId: string) => { const fetchPortfolio = async (userId: string) => {
try { try {

8
frontend/app/watchlist/page.tsx
View File

@@ -1,12 +1,12 @@
'use client'; 'use client';
import { useSession } from 'next-auth/react'; import { useSession } from '@/lib/better-auth';
import { useRouter } from 'next/navigation'; import { useRouter } from 'next/navigation';
import { useEffect, useState } from 'react'; import { useEffect, useState } from 'react';
import Link from 'next/link'; import Link from 'next/link';
export default function WatchlistPage() { export default function WatchlistPage() {
const { data: session, status } = useSession(); const { data: session, isPending } = useSession();
const router = useRouter(); const router = useRouter();
const [watchlist, setWatchlist] = useState([]); const [watchlist, setWatchlist] = useState([]);
const [loading, setLoading] = useState(true); const [loading, setLoading] = useState(true);
@@ -14,7 +14,7 @@ export default function WatchlistPage() {
const [newStock, setNewStock] = useState({ ticker: '', company_name: '', sector: '' }); const [newStock, setNewStock] = useState({ ticker: '', company_name: '', sector: '' });
useEffect(() => { useEffect(() => {
if (status === 'unauthenticated') { if (!isPending && !session) {
router.push('/auth/signin'); router.push('/auth/signin');
return; return;
} }
@@ -22,7 +22,7 @@ export default function WatchlistPage() {
if (session?.user) { if (session?.user) {
fetchWatchlist(session.user.id); fetchWatchlist(session.user.id);
} }
}, [session, status, router]); }, [session, isPending, router]);
const fetchWatchlist = async (userId: string) => { const fetchWatchlist = async (userId: string) => {
try { try {

3693
frontend/package-lock.json generated Normal file
View File

File diff suppressed because it is too large Load Diff

21
frontend/package.json
View File

@@ -8,30 +8,29 @@
"lint": "next lint" "lint": "next lint"
}, },
"dependencies": { "dependencies": {
"next": "16.1.6",
"better-auth": "^1.4.18",
"react": "^19.2.4",
"react-dom": "^19.2.4",
"recharts": "^3.7.0",
"lucide-react": "^0.574.0",
"date-fns": "^4.1.0",
"@radix-ui/react-dialog": "^1.1.15", "@radix-ui/react-dialog": "^1.1.15",
"@radix-ui/react-dropdown-menu": "^2.1.16", "@radix-ui/react-dropdown-menu": "^2.1.16",
"@radix-ui/react-slot": "^1.2.4", "@radix-ui/react-slot": "^1.2.4",
"@radix-ui/react-tabs": "^1.1.13", "@radix-ui/react-tabs": "^1.1.13",
"@radix-ui/react-toast": "^1.2.15", "@radix-ui/react-toast": "^1.2.15",
"better-auth": "^1.4.18",
"class-variance-authority": "^0.7.1", "class-variance-authority": "^0.7.1",
"clsx": "^2.1.1", "clsx": "^2.1.1",
"date-fns": "^4.1.0",
"lucide-react": "^0.574.0",
"next": "16.1.6",
"react": "^19.2.4",
"react-dom": "^19.2.4",
"recharts": "^3.7.0",
"tailwind-merge": "^3.5.0" "tailwind-merge": "^3.5.0"
}, },
"devDependencies": { "devDependencies": {
"@types/node": "^25.3.0", "@types/node": "^25.3.0",
"@types/react": "^19.2.14", "@types/react": "^19.2.14",
"@types/react-dom": "^19.2.3", "@types/react-dom": "^19.2.3",
"typescript": "^5.9.3",
"tailwindcss": "^4.2.0",
"postcss": "^8.5.6",
"autoprefixer": "^10.4.24", "autoprefixer": "^10.4.24",
"@tailwindcss/postcss": "^4.0.0" "postcss": "^8.5.6",
"tailwindcss": "^3.4.17",
"typescript": "^5.9.3"
} }
} }

2
frontend/postcss.config.js
View File

@@ -1,6 +1,6 @@
module.exports = { module.exports = {
plugins: { plugins: {
'@tailwindcss/postcss': {}, tailwindcss: {},
autoprefixer: {}, autoprefixer: {},
}, },
} }