Starfield Mall

// stores/useFavoritesStore.ts — Vuex→Pinia 마이그레이션
import { defineStore } from "pinia";
import { ref, computed } from "vue";
import { favoriteApi } from "@/api/favorite";

export const useFavoritesStore = defineStore("favorites", () => {
  const ids = ref<Set<string>>(new Set());
  const count = computed(() => ids.value.size);
  const isFavorite = (id: string) => ids.value.has(id);

  // 낙관적 업데이트: UI를 먼저 바꾸고 실패 시 롤백
  async function toggle(id: string) {
    const prev = new Set(ids.value);
    if (ids.value.has(id)) ids.value.delete(id);
    else ids.value.add(id);
    try {
      await favoriteApi.sync([...ids.value]);
    } catch {
      ids.value = prev;
    }
  }

  return { ids, count, isFavorite, toggle };
});

포트폴리오 설명을 위해 NDA 범위 안에서 재구성한 코드 예시입니다. 실제 저장소 원문이나 고객사 기밀 정보는 포함하지 않았습니다.