import { create } from 'zustand';
import type { TodoState, Todo } from './types';
import { createJSONStorage, persist } from 'zustand/middleware';

export const useTodoStore = create<TodoState>()(
  persist(
    (set, get) => {
      return {
        todos: [],
        filter: 'all',
        addTodo: text => {
          if (!text.trim()) return;
          const newTodo: Todo = {
            id: crypto.randomUUID(), // 生成唯一的 ID
            text,
            completed: false,
            createAt: Date.now(),
          };
          set(state => ({ todos: [newTodo, ...state.todos] }));
        },

        toggleTodo(id) {
          set(state => ({
            todos: state.todos.map(todo =>
              todo.id === id ? { ...todo, completed: !todo.completed } : todo,
            ),
          }));
        },

        deleteTodo(id) {
          set(state => ({
            todos: state.todos.filter(todo => todo.id !== id),
          }));
        },

        setFilter(filter) {
          set({ filter });
        },

        clearCompleted() {
          set(state => ({
            todos: state.todos.filter(todo => !todo.completed),
          }));
        },
      };
    },
    {
      name: 'todo-storage',
      storage: createJSONStorage(() => localStorage),
    },
  ),
);