fix(auth): Google Sign-In audience mismatch + remove per-user accent color
Root cause of "Google authentication failed": appsettings.Development.json had Auth:GoogleClientId set to the literal placeholder "CHANGE_ME_GOOGLE_CLIENT_ID" while the frontend's .env.development had a real (already-public, already-committed) client ID -- every Google ID token's audience check failed against the backend's placeholder. Fixed by setting the same real client ID on both sides (a client ID is a public identifier, not a secret, safe to commit -- unlike a client secret). Also enabled Auth:AllowRegistration in dev so the existing Google-first self-serve-signup path (auto-create on unmatched verified email, auto-link on matching verified email -- built during Wave 7) is actually exercisable locally. Wired the previously-missing Auth__MicrosoftClientId / NEXT_PUBLIC_MICROSOFT_CLIENT_ID into docker-compose.yml/.env.example (distinct from the existing MICROSOFT_CLIENT_ID used for Outlook mail linking) -- Microsoft sign-in was never deployable, a leftover gap from when it was built. Fixed a stale env-var name in the Microsoft setup hint copy (still said REACT_APP_*, predates the Next.js migration). Removed the per-user accent color picker entirely: it was purely client-side (localStorage + theme.ts), never touched the backend/DB. theme.ts now hardcodes a single ACCENT constant; themePrefs.ts drops get/set/clearAccentColor; App.tsx and SettingsView.tsx drop the accentColor prop threading. Dead accent-related i18n keys removed from both locales. Consolidated Settings' "Account" tab (duplicated GoogleAuthCard, which already lives on the Profile page) into Profile: moved AuthStatusCard and EmailProviderConnections there alongside the existing Google/ Microsoft auth cards, so identity/account-linking lives in one place. Settings drops from 5 tabs to 4 and its General tab uses a consistent SectionCard layout instead of ad-hoc per-card styling. Verified: dotnet build/test (177/177) and npm build/test (57/57) both green; confirmed live against a running dev server that /auth/config now reports googleEnabled with the corrected client ID, Settings has no accent controls, and Profile shows the consolidated auth section.
This commit is contained in:
@@ -2,6 +2,10 @@ import { alpha, createTheme, darken, lighten } from "@mui/material/styles";
|
||||
|
||||
type PaletteLike = Record<string, any>;
|
||||
|
||||
// Single global brand accent -- matches the dark sidebar/landing page indigo used throughout
|
||||
// the app. Not user-configurable; see jobbjakt-nextjs-migration memory / UI rework notes.
|
||||
const ACCENT = "#6366F1";
|
||||
|
||||
function buildPrimary(main: string) {
|
||||
return {
|
||||
lighter: lighten(main, 0.82),
|
||||
@@ -12,7 +16,7 @@ function buildPrimary(main: string) {
|
||||
};
|
||||
}
|
||||
|
||||
function buildLightPalette(accentColor: string): PaletteLike {
|
||||
function buildLightPalette(): PaletteLike {
|
||||
const textPrimary = "#1B1B1F";
|
||||
const textSecondary = "#46464F";
|
||||
|
||||
@@ -24,7 +28,7 @@ function buildLightPalette(accentColor: string): PaletteLike {
|
||||
const disabledBackground = "#E4E1E6";
|
||||
|
||||
return {
|
||||
primary: buildPrimary(accentColor || "#6366F1"),
|
||||
primary: buildPrimary(ACCENT),
|
||||
secondary: {
|
||||
lighter: "#E0E0FF",
|
||||
light: "#C3C4E4",
|
||||
@@ -82,14 +86,14 @@ function buildLightPalette(accentColor: string): PaletteLike {
|
||||
// from the product mockups; cards/inputs (paper) sit above it.
|
||||
background: { default: "#F4F6FB", paper: background },
|
||||
action: {
|
||||
hover: alpha(accentColor || "#6366F1", 0.05),
|
||||
hover: alpha(ACCENT, 0.05),
|
||||
disabled: alpha(disabled, 0.6),
|
||||
disabledBackground: alpha(disabledBackground, 0.9),
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
function buildDarkPalette(accentColor: string): PaletteLike {
|
||||
function buildDarkPalette(): PaletteLike {
|
||||
const bg = "#0B0B0E";
|
||||
const paper = "#111116";
|
||||
const divider = alpha("#FFFFFF", 0.10);
|
||||
@@ -101,7 +105,7 @@ function buildDarkPalette(accentColor: string): PaletteLike {
|
||||
const disabledBackground = alpha("#FFFFFF", 0.08);
|
||||
|
||||
return {
|
||||
primary: buildPrimary(accentColor || "#6366F1"),
|
||||
primary: buildPrimary(ACCENT),
|
||||
secondary: {
|
||||
lighter: alpha(secondaryMain, 0.22),
|
||||
light: alpha(secondaryMain, 0.14),
|
||||
@@ -157,7 +161,7 @@ function buildDarkPalette(accentColor: string): PaletteLike {
|
||||
divider,
|
||||
background: { default: bg, paper },
|
||||
action: {
|
||||
hover: alpha(accentColor || "#6366F1", 0.16),
|
||||
hover: alpha(ACCENT, 0.16),
|
||||
disabled: alpha("#FFFFFF", 0.5),
|
||||
disabledBackground,
|
||||
},
|
||||
@@ -196,9 +200,9 @@ function buildTypography() {
|
||||
};
|
||||
}
|
||||
|
||||
export const getTheme = (_mode: "light" | "dark", accentColor: string) => {
|
||||
const lightPalette = buildLightPalette(accentColor);
|
||||
const darkPalette = buildDarkPalette(accentColor);
|
||||
export const getTheme = (_mode: "light" | "dark") => {
|
||||
const lightPalette = buildLightPalette();
|
||||
const darkPalette = buildDarkPalette();
|
||||
|
||||
const theme = createTheme({
|
||||
breakpoints: {
|
||||
|
||||
Reference in New Issue
Block a user