Update

app/Http/Middleware/HandleInertiaRequests.php

@@ -38,10 +38,6 @@ public function share(Request $request): array
     {
         return [
             ...parent::share($request),
-            'auth' => [
-                'user' => $request->user(),
-                'user_is_admin' => user_is_master_admin($request->user()),
-            ],
             'ziggy' => fn (): array => [
                 ...(new Ziggy)->toArray(),
                 'location' => $request->url(),

resources/js/app.tsx

@@ -8,8 +8,6 @@ import { ErrorBoundary } from 'react-error-boundary';
 import { GA4Provider } from '@/plugins/GA4Context.jsx'; // Updated import
 import DetailedErrorFallback from './components/custom/detailed-error-fallback'; // Import your component
 import { Toaster } from './components/ui/sonner';
-import { useTheme } from './hooks/useTheme';
-import AuthDialog from './modules/auth/AuthDialog';
 import { AxiosProvider } from './plugins/AxiosContext';
 import { MittProvider } from './plugins/MittContext';
 
@@ -40,8 +38,7 @@ createInertiaApp({
                     <MittProvider>
                         <AxiosProvider>
                             <Toaster position="top-right" />
-                            <AuthDialog />
+                            {/*  <AuthDialog /> */}
-
                             <App {...props} />
                         </AxiosProvider>
                     </MittProvider>

resources/js/components/app-header.tsx

@@ -7,8 +7,9 @@ import { Sheet, SheetContent, SheetHeader, SheetTitle, SheetTrigger } from '@/co
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip';
 import { UserMenuContent } from '@/components/user-menu-content';
 import { cn } from '@/lib/utils';
-import { type BreadcrumbItem, type NavItem, type SharedData } from '@/types';
+import { type BreadcrumbItem, type NavItem } from '@/types';
-import { Link, usePage } from '@inertiajs/react';
+import { Link } from '@inertiajs/react';
+import useUserStore from '@/stores/UserStore';
 import { LayoutGrid, Menu, Search } from 'lucide-react';
 import AppLogo from './app-logo';
 import AppLogoIcon from './app-logo-icon';
@@ -41,8 +42,7 @@ interface AppHeaderProps {
 }
 
 export function AppHeader({ breadcrumbs = [] }: AppHeaderProps) {
-    const page = usePage<SharedData>();
+    const { user } = useUserStore();
-    const { auth } = page.props;
     return (
         <>
             <div className="border-sidebar-border/80 border-b">
@@ -156,7 +156,7 @@ export function AppHeader({ breadcrumbs = [] }: AppHeaderProps) {
                                 </Button>
                             </DropdownMenuTrigger>
                             <DropdownMenuContent className="w-56" align="end">
-                                <UserMenuContent user={auth.user} />
+                                <UserMenuContent user={user} />
                             </DropdownMenuContent>
                         </DropdownMenu>
                     </div>

resources/js/components/app-sidebar.tsx

@@ -2,8 +2,9 @@ import { NavFooter } from '@/components/nav-footer';
 import { NavMain } from '@/components/nav-main';
 import { NavUser } from '@/components/nav-user';
 import { Sidebar, SidebarContent, SidebarFooter, SidebarHeader, SidebarMenu, SidebarMenuButton, SidebarMenuItem } from '@/components/ui/sidebar';
-import { SharedData, type NavItem } from '@/types';
+import { type NavItem } from '@/types';
-import { Link, usePage } from '@inertiajs/react';
+import { Link } from '@inertiajs/react';
+import useUserStore from '@/stores/UserStore';
 import { LayoutGrid, UserCog } from 'lucide-react';
 import AppLogo from './app-logo';
 
@@ -42,7 +43,7 @@ const footerNavItems: NavItem[] = [
 ];
 
 export function AppSidebar() {
-    const { auth } = usePage<SharedData>().props;
+    const { user } = useUserStore();
 
     return (
         <Sidebar collapsible="icon" variant="inset">

resources/js/components/nav-user.tsx

@@ -3,12 +3,11 @@ import { SidebarMenu, SidebarMenuButton, SidebarMenuItem, useSidebar } from '@/c
 import { UserInfo } from '@/components/user-info';
 import { UserMenuContent } from '@/components/user-menu-content';
 import { useIsMobile } from '@/hooks/use-mobile';
-import { type SharedData } from '@/types';
+import useUserStore from '@/stores/UserStore';
-import { usePage } from '@inertiajs/react';
 import { ChevronsUpDown } from 'lucide-react';
 
 export function NavUser() {
-    const { auth } = usePage<SharedData>().props;
+    const { user } = useUserStore();
     const { state } = useSidebar();
     const isMobile = useIsMobile();
 
@@ -18,7 +17,7 @@ export function NavUser() {
                 <DropdownMenu>
                     <DropdownMenuTrigger asChild>
                         <SidebarMenuButton size="lg" className="text-sidebar-accent-foreground data-[state=open]:bg-sidebar-accent group">
-                            <UserInfo user={auth.user} />
+                            <UserInfo user={user} />
                             <ChevronsUpDown className="ml-auto size-4" />
                         </SidebarMenuButton>
                     </DropdownMenuTrigger>
@@ -27,7 +26,7 @@ export function NavUser() {
                         align="end"
                         side={isMobile ? 'bottom' : state === 'collapsed' ? 'left' : 'bottom'}
                     >
-                        <UserMenuContent user={auth.user} />
+                        <UserMenuContent user={user} />
                     </DropdownMenuContent>
                 </DropdownMenu>
             </SidebarMenuItem>

resources/js/modules/auth/AuthDialog.jsx

@@ -18,7 +18,8 @@ const AuthDialog = ({}) => {
     // Listen for text element selection (but don't auto-open sidebar)
     useEffect(() => {
         const handleOpenAuth = () => {
-            setIsOpen(true);
+            // Disabled for MVP - don't auto-open auth dialog
+            // setIsOpen(true);
         };
 
         const handleOpenLogin = () => {

resources/js/modules/auth/auth-user.jsx

@@ -1,18 +1,15 @@
 import useUserStore from '@/stores/UserStore';
-import { usePage } from '@inertiajs/react';
 import { useEffect } from 'react';
 
 const AuthUser = () => {
-    const { auth } = usePage().props;
     const { user, fetchUser } = useUserStore();
 
     useEffect(() => {
-        if (auth.user) {
+        // Always try to fetch user data on component mount
-            if (user == null) {
+        if (user === null) {
-                fetchUser();
+            fetchUser();
-            }
         }
-    }, [auth.user]);
+    }, [user, fetchUser]);
 };
 
 export default AuthUser;

resources/js/modules/editor/partials/edit-nav-sidebar.jsx

@@ -1,13 +1,12 @@
-import { usePage } from '@inertiajs/react';
-
 import { Button } from '@/components/ui/button';
 import { Sheet, SheetContent, SheetHeader, SheetTitle } from '@/components/ui/sheet';
 import { useMitt } from '@/plugins/MittContext';
 import useLocalSettingsStore from '@/stores/localSettingsStore';
+import useUserStore from '@/stores/UserStore';
 import { Link } from '@inertiajs/react';
 
 export default function EditNavSidebar({ isOpen, onClose }) {
-    const { auth } = usePage().props;
+    const { user } = useUserStore();
 
     const emitter = useMitt();
 
@@ -32,7 +31,7 @@ export default function EditNavSidebar({ isOpen, onClose }) {
 
                 <div className="space-y-3">
                     <div className="grid px-2">
-                        {!auth.user && (
+                        {!user && (
                             <Button
                                 onClick={() => {
                                     openAuth(false);
@@ -42,7 +41,7 @@ export default function EditNavSidebar({ isOpen, onClose }) {
                                 Sign Up
                             </Button>
                         )}
-                        {!auth.user && (
+                        {!user && (
                             <Button
                                 onClick={() => {
                                     openAuth(true);
@@ -58,7 +57,7 @@ export default function EditNavSidebar({ isOpen, onClose }) {
                         <Link className="text-primary block w-full text-sm underline-offset-4 hover:underline" href={route('home')} as="button">
                             Home
                         </Link>
-                        {auth.user && (
+                        {user && (
                             <Link
                                 className="text-primary block w-full text-sm underline-offset-4 hover:underline"
                                 method="post"

resources/js/modules/editor/partials/editor-ai-sheet.jsx

@@ -28,8 +28,7 @@ const EditorAISheet = () => {
     const pollingIntervalRef = useRef(null);
     const currentJobIdRef = useRef(null);
 
-    const { credits } = useUserStore();
+    const { credits, user } = useUserStore();
-    const { auth } = usePage().props;
 
     useEffect(() => {
         const openSheetListener = () => {
@@ -46,10 +45,10 @@ const EditorAISheet = () => {
 
     // Check for active job on component mount
     useEffect(() => {
-        if (auth.user) {
+        if (user) {
             checkForActiveJob();
         }
-    }, [auth.user]);
+    }, [user]);
 
     const checkForActiveJob = async () => {
         try {
@@ -218,7 +217,7 @@ const EditorAISheet = () => {
                             </div>
                         )}
                         <div className={cn('space-y-2', !prompt.trim() && 'invisible')}>
-                            {auth.user ? (
+                            {user ? (
                                 <>
                                     <Button
                                         onClick={handleSend}

resources/js/modules/upgrade/upgrade-sheet.jsx

@@ -1,5 +1,4 @@
 // resources/js/Pages/User/Partials/upgrade-sheet.jsx
-import { usePage } from '@inertiajs/react';
 
 import { SparklesText } from '@/components/magicui/sparkles-text';
 import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '@/components/ui/accordion';
@@ -17,8 +16,7 @@ import UpgradePlanCarousel from './partials/upgrade-plan-carousel.tsx';
 
 const UpgradeSheet = () => {
     const { subscription, one_times, isFetchingPricing, fetchPricing, isCheckingOut, checkoutSubscribe, checkoutPurchase } = usePricingStore();
-    const { plan, billing, user_usage, credits, redirectBillingPortal, isRedirectingToBilling } = useUserStore();
+    const { plan, billing, user_usage, credits, redirectBillingPortal, isRedirectingToBilling, user } = useUserStore();
-    const { auth } = usePage().props;
 
     // State to control sheet visibility
     const [isOpen, setIsOpen] = useState(false);
@@ -118,7 +116,7 @@ const UpgradeSheet = () => {
                 </SheetHeader>
 
                 <div className="mx-auto w-full max-w-[600px] space-y-3 px-4">
-                    {auth?.user ? (
+                    {user ? (
                         <div id="stats">
                             <div className="grid grid-cols-1 gap-3 sm:grid-cols-2">
                                 {/* Non-watermark Exports */}
@@ -163,7 +161,7 @@ const UpgradeSheet = () => {
 
                     {subscription ? (
                         <>
-                            {auth.user && plan.tier != 'free' ? (
+                            {user && plan.tier != 'free' ? (
                                 <div className="mx-auto space-y-6 rounded-lg border p-4 text-center sm:p-7">
                                     <SparklesText className="text-xl font-bold sm:text-xl">You're now in the {plan?.name} plan!</SparklesText>
                                 </div>
@@ -268,7 +266,7 @@ const UpgradeSheet = () => {
                         </div>
                     </div>
 
-                    {!(auth.user && plan.tier != 'free') && (
+                    {!(user && plan.tier != 'free') && (
                         <div id="faq" className="space-y-4 rounded-lg border p-4 sm:p-7">
                             <div className="text-center text-xl font-extrabold sm:text-2xl">Frequently Asked Questions</div>
                             <Accordion type="single" collapsible className="w-full" defaultValue="item-1">

resources/js/pages/settings/profile.tsx

@@ -1,6 +1,6 @@
-import { type BreadcrumbItem, type SharedData } from '@/types';
+import { type BreadcrumbItem } from '@/types';
 import { Transition } from '@headlessui/react';
-import { Head, Link, useForm, usePage } from '@inertiajs/react';
+import { Head, Link, useForm } from '@inertiajs/react';
 import { FormEventHandler } from 'react';
 
 import DeleteUser from '@/components/delete-user';
@@ -11,6 +11,7 @@ import { Input } from '@/components/ui/input';
 import { Label } from '@/components/ui/label';
 import AppLayout from '@/layouts/app-layout';
 import SettingsLayout from '@/layouts/settings/layout';
+import useUserStore from '@/stores/UserStore';
 
 const breadcrumbs: BreadcrumbItem[] = [
     {
@@ -25,11 +26,11 @@ type ProfileForm = {
 }
 
 export default function Profile({ mustVerifyEmail, status }: { mustVerifyEmail: boolean; status?: string }) {
-    const { auth } = usePage<SharedData>().props;
+    const { user } = useUserStore();
 
     const { data, setData, patch, errors, processing, recentlySuccessful } = useForm<Required<ProfileForm>>({
-        name: auth.user.name,
+        name: user?.name || '',
-        email: auth.user.email,
+        email: user?.email || '',
     });
 
     const submit: FormEventHandler = (e) => {
@@ -82,7 +83,7 @@ export default function Profile({ mustVerifyEmail, status }: { mustVerifyEmail:
                             <InputError className="mt-2" message={errors.email} />
                         </div>
 
-                        {mustVerifyEmail && auth.user.email_verified_at === null && (
+                        {mustVerifyEmail && user?.email_verified_at === null && (
                             <div>
                                 <p className="text-muted-foreground -mt-4 text-sm">
                                     Your email address is unverified.{' '}

resources/js/pages/welcome.tsx

@@ -1,8 +1,8 @@
-import { type SharedData } from '@/types';
+import { Head, Link } from '@inertiajs/react';
-import { Head, Link, usePage } from '@inertiajs/react';
+import useUserStore from '@/stores/UserStore';
 
 export default function Welcome() {
-    const { auth } = usePage<SharedData>().props;
+    const { user } = useUserStore();
 
     return (
         <>
@@ -13,7 +13,7 @@ export default function Welcome() {
             <div className="flex min-h-screen flex-col items-center bg-[#FDFDFC] p-6 text-[#1b1b18] lg:justify-center lg:p-8 dark:bg-[#0a0a0a]">
                 <header className="mb-6 w-full max-w-[335px] text-sm not-has-[nav]:hidden lg:max-w-4xl">
                     <nav className="flex items-center justify-end gap-4">
-                        {auth.user ? (
+                        {user ? (
                             <Link
                                 href={route(config('platform.general.authed_route_redirect'))}
                                 className="inline-block rounded-sm border border-[#19140035] px-5 py-1.5 text-sm leading-normal text-[#1b1b18] hover:border-[#1915014a] dark:border-[#3E3E3A] dark:text-[#EDEDEC] dark:hover:border-[#62605b]"

resources/js/types/index.d.ts

@@ -1,10 +1,6 @@
 import { LucideIcon } from 'lucide-react';
 import type { Config } from 'ziggy-js';
 
-export interface Auth {
-    user: User;
-    user_is_admin: boolean;
-}
 
 export interface BreadcrumbItem {
     title: string;
@@ -24,7 +20,6 @@ export interface NavItem {
 }
 
 export interface SharedData {
-    auth: Auth;
     ziggy: Config & { location: string };
     [key: string]: unknown;
 }