1
// 核心数据结构
2
export interface AppState {
3
  settings: Settings;
4
  categories: Category[];
5
}
6

7
// 数据持久化
8
try {
9
  const parsed = JSON.parse(saved);
10
  return {
11
    ...defaultState,
12
    ...parsed,
13
    settings: { ...defaultState.settings, ...parsed.settings },
14
  };
15
} catch (e) {
16
  console.error('Failed to parse saved data', e);
17
}

1
const syncToRepo = useCallback(async (tokenOverride?: string, repoOverride?: string) => {
2
  const token = tokenOverride || state.settings.githubToken;
3
  const repo = repoOverride || state.settings.githubRepo;
4
  if (!token || !repo) throw new Error('缺少 GitHub Token 或 仓库名');
5

6
  // 剔除敏感信息
7
  const stateToSave = {
8
    ...state,
9
    settings: { ...state.settings, githubToken: '', githubRepo: '' }
10
  };
11

12
  // 执行 GitHub API 请求
13
  // ...
14
}, [state]);

1
<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-4">
2
  {category.bookmarks.map((bookmark) => (
3
    <a
4
      key={bookmark.id}
5
      href={bookmark.url}
6
      target="_blank"
7
      rel="noopener noreferrer"
8
      className="flex items-center p-4 rounded-2xl glass hover:bg-white/10 hover:-translate-y-0.5 hover:border-white/15 transition-all duration-300 group"
9
    >
10
      {/* 书签内容 */}
11
    </a>
12
  ))}
13
</div>