Files
maternal-app/maternal-web/store/slices/authSlice.ts
Andrei fb92160322 fix: Resolve black pages issue - Add missing auth slice and update checker
Fixed critical issues causing tracking pages to display black:
1. PWA service worker caching old JavaScript chunks
2. Missing auth Redux slice causing undefined errors

## Service Worker Update Checker
- Added /public/check-updates.js script
- Checks for SW updates every 60 seconds
- Auto-reloads page when new SW is activated
- Forces update check on page load
- Prevents future cache staleness issues

## Auth Redux Slice
- Created store/slices/authSlice.ts with User interface
- Added auth reducer to Redux store configuration
- Included auth in persist whitelist
- Provides selectors: selectUser, selectFamilyId, etc.
- Fixes "Cannot read properties of undefined (reading 'user')" error

## Root Cause
Tracking pages reference state.auth.user.familyId but auth slice
didn't exist in Redux store, causing TypeError on all tracking pages.

Build:  PASSED
Files: 3 new, 2 modified

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-10-05 06:20:51 +00:00

62 lines
1.7 KiB
TypeScript

import { createSlice, PayloadAction } from '@reduxjs/toolkit';
import type { RootState } from '../store';
export interface User {
id: string;
email: string;
name: string;
familyId: string;
}
export interface AuthState {
user: User | null;
token: string | null;
isAuthenticated: boolean;
loading: boolean;
}
const initialState: AuthState = {
user: null,
token: null,
isAuthenticated: false,
loading: false,
};
const authSlice = createSlice({
name: 'auth',
initialState,
reducers: {
setUser: (state, action: PayloadAction<User>) => {
state.user = action.payload;
state.isAuthenticated = true;
},
setToken: (state, action: PayloadAction<string>) => {
state.token = action.payload;
},
setAuth: (state, action: PayloadAction<{ user: User; token: string }>) => {
state.user = action.payload.user;
state.token = action.payload.token;
state.isAuthenticated = true;
},
logout: (state) => {
state.user = null;
state.token = null;
state.isAuthenticated = false;
},
setLoading: (state, action: PayloadAction<boolean>) => {
state.loading = action.payload;
},
},
});
export const { setUser, setToken, setAuth, logout, setLoading } = authSlice.actions;
// Selectors
export const selectUser = (state: RootState) => state.auth?.user;
export const selectToken = (state: RootState) => state.auth?.token;
export const selectIsAuthenticated = (state: RootState) => state.auth?.isAuthenticated ?? false;
export const selectAuthLoading = (state: RootState) => state.auth?.loading ?? false;
export const selectFamilyId = (state: RootState) => state.auth?.user?.familyId;
export default authSlice.reducer;