'use client';

import { usePathname } from 'next/navigation';
import { useEffect } from 'react';

import { useStores } from '@/app/(root)/AppProviders';

/**
 * Ensures that the pinned clips are loaded
 */
export default function usePinnedClipsInitialize() {
  const { clips: clipsStore, session: sessionStore } = useStores();

  const pathname = usePathname();

  const needsPinnedClipsFetch =
    !clipsStore.pinnedClipsInitialized &&
    sessionStore.userId &&
    pathname !== '/home';

  useEffect(() => {
    if (needsPinnedClipsFetch) {
      clipsStore.fetchPinnedClips();
      clipsStore.pinnedClipsInitialized = true;
    }
  }, [needsPinnedClipsFetch, clipsStore]);
}