Fixed states
Fixed & removed unused states from codes
This commit is contained in:
parent
ee16b63d90
commit
ba023153fd
1 changed files with 4 additions and 99 deletions
|
|
@ -1,42 +1,16 @@
|
||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
// src/hooks/useSharedState.tsx
|
// src/hooks/useSharedState.tsx
|
||||||
import React, {createContext, MutableRefObject, useContext, useRef, useState} from 'react'
|
import React, {createContext, useContext, useRef, useState} from 'react'
|
||||||
import {useTheme} from 'next-themes'
|
|
||||||
|
|
||||||
// Define the shape of our shared state
|
// Define the shape of our shared state
|
||||||
interface SharedState {
|
interface SharedState {
|
||||||
// UI States
|
// UI States
|
||||||
isScrolled: boolean
|
|
||||||
setIsScrolled: React.Dispatch<React.SetStateAction<boolean>>
|
|
||||||
isSearchExpanded: boolean
|
|
||||||
setIsSearchExpanded: React.Dispatch<React.SetStateAction<boolean>>
|
|
||||||
isDrawerOpen: boolean
|
isDrawerOpen: boolean
|
||||||
setIsDrawerOpen: React.Dispatch<React.SetStateAction<boolean>>
|
setIsDrawerOpen: React.Dispatch<React.SetStateAction<boolean>>
|
||||||
isCreateModalOpen: boolean
|
|
||||||
setIsCreateModalOpen: React.Dispatch<React.SetStateAction<boolean>>
|
|
||||||
isUserModalOpen: boolean
|
|
||||||
setIsUserModalOpen: React.Dispatch<React.SetStateAction<boolean>>
|
|
||||||
isNotificationsOpen: boolean
|
|
||||||
setIsNotificationsOpen: React.Dispatch<React.SetStateAction<boolean>>
|
|
||||||
showBackToTop: boolean
|
|
||||||
setShowBackToTop: React.Dispatch<React.SetStateAction<boolean>>
|
|
||||||
|
|
||||||
// Refs
|
// Refs
|
||||||
drawerRef: React.RefObject<HTMLDivElement>
|
drawerRef: React.RefObject<HTMLDivElement | null>
|
||||||
userModalRef: React.RefObject<HTMLDivElement>
|
|
||||||
notificationsRef: React.RefObject<HTMLDivElement>
|
|
||||||
createModalRef: React.RefObject<HTMLDivElement>
|
|
||||||
fileInputRef: React.RefObject<HTMLInputElement>
|
|
||||||
observerRef: MutableRefObject<IntersectionObserver | null>
|
|
||||||
loadingRef: MutableRefObject<boolean>
|
|
||||||
|
|
||||||
// Theme
|
|
||||||
theme: string | undefined
|
|
||||||
}
|
|
||||||
|
|
||||||
export function useMutableRef<T>(initialValue: T): MutableRefObject<T> {
|
|
||||||
return useRef<T>(initialValue) as MutableRefObject<T>
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// Create the context
|
// Create the context
|
||||||
|
|
@ -45,54 +19,19 @@ const SharedStateContext = createContext<SharedState | undefined>(undefined)
|
||||||
// Create the provider component
|
// Create the provider component
|
||||||
export function SharedStateProvider({children}: { children: React.ReactNode }) {
|
export function SharedStateProvider({children}: { children: React.ReactNode }) {
|
||||||
// UI States
|
// UI States
|
||||||
const [isScrolled, setIsScrolled] = useState(false)
|
|
||||||
const [isSearchExpanded, setIsSearchExpanded] = useState(false)
|
|
||||||
const [isDrawerOpen, setIsDrawerOpen] = useState(false)
|
const [isDrawerOpen, setIsDrawerOpen] = useState(false)
|
||||||
const [isCreateModalOpen, setIsCreateModalOpen] = useState(false)
|
|
||||||
const [isUserModalOpen, setIsUserModalOpen] = useState(false)
|
|
||||||
const [isNotificationsOpen, setIsNotificationsOpen] = useState(false)
|
|
||||||
const [showBackToTop, setShowBackToTop] = useState(false)
|
|
||||||
|
|
||||||
// Refs
|
// Refs
|
||||||
const drawerRef = useRef<HTMLDivElement>(null)
|
const drawerRef = useRef<HTMLDivElement>(null)
|
||||||
const userModalRef = useRef<HTMLDivElement>(null)
|
|
||||||
const notificationsRef = useRef<HTMLDivElement>(null)
|
|
||||||
const createModalRef = useRef<HTMLDivElement>(null)
|
|
||||||
const fileInputRef = useRef<HTMLInputElement>(null)
|
|
||||||
const loadingRef = useMutableRef<boolean>(false)
|
|
||||||
const observerRef = useMutableRef<IntersectionObserver | null>(null)
|
|
||||||
|
|
||||||
// Theme
|
// Theme
|
||||||
const {theme} = useTheme()
|
|
||||||
|
|
||||||
const value = {
|
const value = {
|
||||||
// UI States
|
// UI States
|
||||||
isScrolled,
|
|
||||||
setIsScrolled,
|
|
||||||
isSearchExpanded,
|
|
||||||
setIsSearchExpanded,
|
|
||||||
isDrawerOpen,
|
isDrawerOpen,
|
||||||
setIsDrawerOpen,
|
setIsDrawerOpen,
|
||||||
isCreateModalOpen,
|
|
||||||
setIsCreateModalOpen,
|
|
||||||
isUserModalOpen,
|
|
||||||
setIsUserModalOpen,
|
|
||||||
isNotificationsOpen,
|
|
||||||
setIsNotificationsOpen,
|
|
||||||
showBackToTop,
|
|
||||||
setShowBackToTop,
|
|
||||||
|
|
||||||
// Refs
|
// Refs
|
||||||
drawerRef,
|
drawerRef,
|
||||||
userModalRef,
|
|
||||||
notificationsRef,
|
|
||||||
createModalRef,
|
|
||||||
fileInputRef,
|
|
||||||
observerRef,
|
|
||||||
loadingRef,
|
|
||||||
|
|
||||||
// Theme
|
|
||||||
theme,
|
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|
@ -114,58 +53,24 @@ export function useSharedState() {
|
||||||
// Optional: Create specific hooks for different parts of the state
|
// Optional: Create specific hooks for different parts of the state
|
||||||
export function useUIState() {
|
export function useUIState() {
|
||||||
const {
|
const {
|
||||||
isScrolled,
|
|
||||||
setIsScrolled,
|
|
||||||
isSearchExpanded,
|
|
||||||
setIsSearchExpanded,
|
|
||||||
isDrawerOpen,
|
isDrawerOpen,
|
||||||
setIsDrawerOpen,
|
setIsDrawerOpen,
|
||||||
isCreateModalOpen,
|
|
||||||
setIsCreateModalOpen,
|
|
||||||
isUserModalOpen,
|
|
||||||
setIsUserModalOpen,
|
|
||||||
isNotificationsOpen,
|
|
||||||
setIsNotificationsOpen,
|
|
||||||
showBackToTop,
|
|
||||||
setShowBackToTop,
|
|
||||||
} = useSharedState()
|
} = useSharedState()
|
||||||
|
|
||||||
return {
|
return {
|
||||||
isScrolled,
|
|
||||||
setIsScrolled,
|
|
||||||
isSearchExpanded,
|
|
||||||
setIsSearchExpanded,
|
|
||||||
isDrawerOpen,
|
isDrawerOpen,
|
||||||
setIsDrawerOpen,
|
setIsDrawerOpen,
|
||||||
isCreateModalOpen,
|
|
||||||
setIsCreateModalOpen,
|
|
||||||
isUserModalOpen,
|
|
||||||
setIsUserModalOpen,
|
|
||||||
isNotificationsOpen,
|
|
||||||
setIsNotificationsOpen,
|
|
||||||
showBackToTop,
|
|
||||||
setShowBackToTop,
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export function useRefs() {
|
export function useRefs() {
|
||||||
const {
|
const {
|
||||||
drawerRef,
|
drawerRef,
|
||||||
userModalRef,
|
|
||||||
notificationsRef,
|
|
||||||
createModalRef,
|
|
||||||
fileInputRef,
|
|
||||||
observerRef,
|
|
||||||
loadingRef,
|
|
||||||
} = useSharedState()
|
} = useSharedState()
|
||||||
|
|
||||||
return {
|
return {
|
||||||
drawerRef,
|
drawerRef,
|
||||||
userModalRef,
|
|
||||||
notificationsRef,
|
|
||||||
createModalRef,
|
|
||||||
fileInputRef,
|
|
||||||
observerRef,
|
|
||||||
loadingRef,
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
Loading…
Add table
Reference in a new issue