pacnpal/thrilltrack-explorer
1
0
Fork 0
mirror of https://github.com/pacnpal/thrilltrack-explorer.git synced 2025-12-23 06:31:12 -05:00
Code Issues Packages Projects Releases Wiki Activity

Improve component stability and user experience with safety checks

Browse Source 
Implement robust error handling, safety checks for data structures, and state management improvements across various components to prevent runtime errors and enhance user experience.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: a71e826a-1d38-4b6e-a34f-fbf5ba1f1b25
Replit-Commit-Checkpoint-Type: intermediate_checkpoint
This commit is contained in:
pac7
2025-10-08 19:27:31 +00:00
parent f21602b992
commit bfba3baf7e
12 changed files with 224 additions and 110 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
src/components/ui/sidebar-context.ts Normal file
View File

@@ -0,0 +1,13 @@
import { createContext } from "react";
export type SidebarContext = {
state: "expanded" | "collapsed";
open: boolean;
setOpen: (open: boolean) => void;
openMobile: boolean;
setOpenMobile: (open: boolean) => void;
isMobile: boolean;
toggleSidebar: () => void;
};
export const SidebarContext = createContext<SidebarContext | null>(null);

29
src/components/ui/sidebar.tsx
View File

@@ -11,6 +11,8 @@ import { Separator } from "@/components/ui/separator";
import { Sheet, SheetContent } from "@/components/ui/sheet";
import { Skeleton } from "@/components/ui/skeleton";
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip";
import { SidebarContext, type SidebarContext as SidebarContextType } from "@/components/ui/sidebar-context";
import { useSidebar } from "@/hooks/useSidebar";
const SIDEBAR_COOKIE_NAME = "sidebar:state";
const SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;
@@ -19,27 +21,6 @@ const SIDEBAR_WIDTH_MOBILE = "18rem";
const SIDEBAR_WIDTH_ICON = "3rem";
const SIDEBAR_KEYBOARD_SHORTCUT = "b";
type SidebarContext = {
state: "expanded" | "collapsed";
open: boolean;
setOpen: (open: boolean) => void;
openMobile: boolean;
setOpenMobile: (open: boolean) => void;
isMobile: boolean;
toggleSidebar: () => void;
};
const SidebarContext = React.createContext<SidebarContext | null>(null);
function useSidebar() {
const context = React.useContext(SidebarContext);
if (!context) {
throw new Error("useSidebar must be used within a SidebarProvider.");
}
return context;
}
const SidebarProvider = React.forwardRef<
HTMLDivElement,
React.ComponentProps<"div"> & {
@@ -92,7 +73,7 @@ const SidebarProvider = React.forwardRef<
// This makes it easier to style the sidebar with Tailwind classes.
const state = open ? "expanded" : "collapsed";
const contextValue = React.useMemo<SidebarContext>(
const contextValue = React.useMemo<SidebarContextType>(
() => ({
state,
open,
@@ -633,5 +614,7 @@ export {
SidebarRail,
SidebarSeparator,
SidebarTrigger,
useSidebar,
};
// Re-export useSidebar from the hooks file for backwards compatibility
export { useSidebar } from "@/hooks/useSidebar";