* refactor: extract booking actions dropdown to separate component - Created BookingActionsDropdown component with all dropdown actions and dialogs - Component receives booking as prop and handles all action logic internally - Removed duplicate dialog states and mutations from BookingListItem - Fixed img tag to use Next.js Image component - Maintains same functionality and UI while improving code reusability Co-Authored-By: eunjae@cal.com <hey@eunjae.dev> * fix: restore cardCharged variable in BookingListItem The cardCharged variable was accidentally removed during the refactoring but is still needed for the actionContext in BookingListItem.tsx Co-Authored-By: eunjae@cal.com <hey@eunjae.dev> * refactor: move BookingItemProps type to separate types.ts file - Created types.ts to hold shared booking types - Updated BookingListItem.tsx to import from types.ts - Updated BookingActionsDropdown.tsx to import from types.ts - Updated bookingActions.ts to import from types.ts - Removed unused RouterInputs and RouterOutputs imports from BookingListItem.tsx - Removes unwanted dependency chain where BookingActionsDropdown imported from BookingListItem Co-Authored-By: eunjae@cal.com <hey@eunjae.dev> * remove unnecessary description * extract states as a zustand store * fix dialog issue * fix type errors --------- Co-authored-by: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
40 lines
1.2 KiB
TypeScript
40 lines
1.2 KiB
TypeScript
"use client";
|
|
|
|
import { createContext, useContext, useRef, type ReactNode } from "react";
|
|
import { useStore } from "zustand";
|
|
import type { StoreApi } from "zustand";
|
|
|
|
import { createBookingActionsStore, type BookingActionsStore } from "./store";
|
|
|
|
export const BookingActionsStoreContext = createContext<StoreApi<BookingActionsStore> | null>(null);
|
|
|
|
export interface BookingActionsStoreProviderProps {
|
|
children: ReactNode;
|
|
}
|
|
|
|
export const BookingActionsStoreProvider = ({ children }: BookingActionsStoreProviderProps) => {
|
|
const storeRef = useRef<StoreApi<BookingActionsStore>>();
|
|
if (!storeRef.current) {
|
|
storeRef.current = createBookingActionsStore();
|
|
}
|
|
|
|
return (
|
|
<BookingActionsStoreContext.Provider value={storeRef.current}>
|
|
{children}
|
|
</BookingActionsStoreContext.Provider>
|
|
);
|
|
};
|
|
|
|
export const useBookingActionsStoreContext = <T,>(
|
|
selector: (store: BookingActionsStore) => T,
|
|
equalityFn?: (a: T, b: T) => boolean
|
|
): T => {
|
|
const bookingActionsStoreContext = useContext(BookingActionsStoreContext);
|
|
|
|
if (!bookingActionsStoreContext) {
|
|
throw new Error("useBookingActionsStoreContext must be used within BookingActionsStoreProvider");
|
|
}
|
|
|
|
return useStore(bookingActionsStoreContext, selector, equalityFn);
|
|
};
|