Fixed states

Fixed & removed unused states from codes
This commit is contained in:
Nixyi 2024-12-12 10:07:24 -03:00
parent ee16b63d90
commit ba023153fd

View file

@ -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,
} }
} }