melabidi/carmanagement
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

fix first online resevation

Browse Source
This commit is contained in:
root
2026-05-09 20:01:51 -04:00
parent c4a45c8b21
commit 09b0e3b55f
75 changed files with 6394 additions and 2190 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/admin/src/components/I18nProvider.tsx
+78 -4
View File
@@ -3,11 +3,15 @@
import { createContext, useContext, useEffect, useMemo, useState } from 'react'
export type AdminLanguage = 'en' | 'fr' | 'ar'
export type AdminTheme = 'light' | 'dark'
type AdminDictionary = {
nav: Record<string, string>
logout: string
language: string
theme: string
light: string
dark: string
overview: string
admin: string
platform: string
@@ -23,9 +27,13 @@ const dictionaries: Record<AdminLanguage, AdminDictionary> = {
renters: 'Renters',
auditLogs: 'Audit Logs',
adminUsers: 'Admin Users',
billing: 'Billing',
},
logout: 'Logout',
language: 'Language',
theme: 'Theme',
light: 'Light',
dark: 'Dark',
overview: 'Platform overview',
admin: 'Admin',
platform: 'Platform',
@@ -33,15 +41,19 @@ const dictionaries: Record<AdminLanguage, AdminDictionary> = {
},
fr: {
nav: {
overview: 'Vue d’ensemble',
overview: "Vue d'ensemble",
companies: 'Entreprises',
siteConfig: 'Config site',
renters: 'Locataires',
auditLogs: 'Journaux d’audit',
auditLogs: "Journaux d'audit",
adminUsers: 'Utilisateurs admin',
billing: 'Facturation',
},
logout: 'Déconnexion',
language: 'Langue',
theme: 'Mode',
light: 'Clair',
dark: 'Sombre',
overview: 'Vue plateforme',
admin: 'Admin',
platform: 'Plateforme',
@@ -55,9 +67,13 @@ const dictionaries: Record<AdminLanguage, AdminDictionary> = {
renters: 'المستأجرون',
auditLogs: 'سجلات التدقيق',
adminUsers: 'مستخدمو الإدارة',
billing: 'الفوترة',
},
logout: 'تسجيل الخروج',
language: 'اللغة',
theme: 'الوضع',
light: 'فاتح',
dark: 'داكن',
overview: 'نظرة عامة على المنصة',
admin: 'الإدارة',
platform: 'المنصة',
@@ -68,6 +84,8 @@ const dictionaries: Record<AdminLanguage, AdminDictionary> = {
type AdminI18nContext = {
language: AdminLanguage
setLanguage: (value: AdminLanguage) => void
theme: AdminTheme
setTheme: (value: AdminTheme) => void
dict: AdminDictionary
}
@@ -75,12 +93,23 @@ const Context = createContext<AdminI18nContext | null>(null)
export function AdminI18nProvider({ children }: { children: React.ReactNode }) {
const [language, setLanguage] = useState<AdminLanguage>('en')
const [theme, setTheme] = useState<AdminTheme>('dark')
useEffect(() => {
const stored = window.localStorage.getItem('admin-language')
const storedTheme = window.localStorage.getItem('admin-theme')
if (stored === 'en' || stored === 'fr' || stored === 'ar') {
setLanguage(stored)
}
if (storedTheme === 'light' || storedTheme === 'dark') {
setTheme(storedTheme)
return
}
if (!window.matchMedia('(prefers-color-scheme: dark)').matches) {
setTheme('light')
}
}, [])
useEffect(() => {
@@ -89,7 +118,18 @@ export function AdminI18nProvider({ children }: { children: React.ReactNode }) {
window.localStorage.setItem('admin-language', language)
}, [language])
const value = useMemo(() => ({ language, setLanguage, dict: dictionaries[language] }), [language])
useEffect(() => {
document.documentElement.classList.remove('light', 'dark')
document.documentElement.classList.add(theme)
document.documentElement.style.colorScheme = theme
document.body.dataset.theme = theme
window.localStorage.setItem('admin-theme', theme)
}, [theme])
const value = useMemo(
() => ({ language, setLanguage, theme, setTheme, dict: dictionaries[language] }),
[language, theme],
)
return <Context.Provider value={value}>{children}</Context.Provider>
}
@@ -110,7 +150,7 @@ export function AdminLanguageSwitcher() {
if (embedded) return null
return (
<div className="flex items-center gap-1 rounded-full border border-zinc-700 bg-zinc-900 px-2 py-1 shadow-sm">
<div className="flex items-center gap-1 rounded-full border border-zinc-700 bg-zinc-900 px-2 py-1 shadow-sm transition-colors">
<span className="px-2 text-[11px] font-semibold uppercase tracking-[0.16em] text-zinc-500">{dict.language}</span>
{(['en', 'fr', 'ar'] as AdminLanguage[]).map((value) => {
const active = value === language
@@ -130,3 +170,37 @@ export function AdminLanguageSwitcher() {
</div>
)
}
export function AdminThemeSwitcher() {
const { theme, setTheme, dict } = useAdminI18n()
const [embedded, setEmbedded] = useState(false)
useEffect(() => {
setEmbedded(window.self !== window.top)
}, [])
if (embedded) return null
return (
<div className="flex items-center gap-1 rounded-full border border-zinc-700 bg-zinc-900 px-2 py-1 shadow-sm transition-colors">
<span className="px-2 text-[11px] font-semibold uppercase tracking-[0.16em] text-zinc-500">
{dict.theme}
</span>
{(['light', 'dark'] as AdminTheme[]).map((value) => {
const active = value === theme
return (
<button
key={value}
type="button"
onClick={() => setTheme(value)}
className={`rounded-full px-3 py-1.5 text-xs font-semibold transition ${
active ? 'bg-zinc-100 text-zinc-950' : 'text-zinc-300 hover:bg-zinc-800'
}`}
>
{value === 'light' ? dict.light : dict.dark}
</button>
)
})}
</div>
)
}
apps/admin/src/components/PublicShell.tsx
+10 -5
View File
@@ -1,7 +1,11 @@
'use client'
import Link from 'next/link'
import { AdminLanguageSwitcher, useAdminI18n } from '@/components/I18nProvider'
import {
AdminLanguageSwitcher,
AdminThemeSwitcher,
useAdminI18n,
} from '@/components/I18nProvider'
export default function PublicShell({ children }: { children: React.ReactNode }) {
const { language } = useAdminI18n()
@@ -24,8 +28,8 @@ export default function PublicShell({ children }: { children: React.ReactNode })
}[language]
return (
<div className="min-h-screen bg-zinc-950 text-zinc-100">
<header className="sticky top-0 z-30 border-b border-zinc-800 bg-zinc-950/90 backdrop-blur-md">
<div className="min-h-screen bg-zinc-950 text-zinc-100 transition-colors">
<header className="sticky top-0 z-30 border-b border-zinc-800 bg-zinc-950/90 backdrop-blur-md transition-colors">
<div className="mx-auto flex max-w-6xl items-center justify-between gap-4 px-4 py-4">
<Link href="/" className="flex items-center gap-3">
<span className="text-xs font-semibold uppercase tracking-[0.24em] text-emerald-400">RentalDriveGo</span>
@@ -39,13 +43,14 @@ export default function PublicShell({ children }: { children: React.ReactNode })
</div>
</header>
<div>{children}</div>
<footer className="border-t border-stone-200 bg-white/90 px-4 py-4 backdrop-blur-md transition-colors">
<footer className="border-t border-stone-200 bg-white/90 px-4 py-4 backdrop-blur-md transition-colors dark:border-zinc-800 dark:bg-zinc-950/90">
<div className="mx-auto flex max-w-6xl flex-col items-center justify-between gap-3 lg:flex-row">
<p className="text-xs font-medium uppercase tracking-[0.16em] text-stone-400">
<p className="text-xs font-medium uppercase tracking-[0.16em] text-stone-400 dark:text-zinc-500">
{dict.preferences}
</p>
<div className="flex flex-col items-center gap-3 sm:flex-row">
<AdminLanguageSwitcher />
<AdminThemeSwitcher />
</div>
</div>
</footer>