feat(acaab): implementasi halaman prestasi & karya mahasiswa

groups/ACAAB/src/context/DataContext.tsx

@@ -0,0 +1,89 @@
+import React, { createContext, useContext, useState, useEffect, ReactNode } from 'react';
+import { Achievement, Project } from '../data';
+import { fetchAchievementsFromAPI, fetchProjectsFromAPI } from '../services/api';
+
+interface DataContextType {
+  achievements: Achievement[];
+  projects: Project[];
+  loading: boolean;
+  error: string | null;
+  refetch: () => Promise<void>;
+}
+
+const DataContext = createContext<DataContextType | undefined>(undefined);
+
+export function DataProvider({ children }: { children: ReactNode }) {
+  const [achievements, setAchievements] = useState<Achievement[]>([]);
+  const [projects, setProjects] = useState<Project[]>([]);
+  const [loading, setLoading] = useState<boolean>(true);
+  const [error, setError] = useState<string | null>(null);
+
+  const loadData = async () => {
+    setLoading(true);
+    setError(null);
+
+    try {
+      const results = await Promise.allSettled([
+        fetchAchievementsFromAPI(),
+        fetchProjectsFromAPI(),
+      ]);
+
+      const achievementsRes = results[0];
+      const projectsRes = results[1];
+
+      let hasError = false;
+      let errorMsgs: string[] = [];
+
+      if (achievementsRes.status === 'fulfilled') {
+        setAchievements(achievementsRes.value);
+      } else {
+        console.error('Failed to fetch achievements:', achievementsRes.reason);
+        errorMsgs.push('Gagal memuat data prestasi.');
+        hasError = true;
+      }
+
+      if (projectsRes.status === 'fulfilled') {
+        setProjects(projectsRes.value);
+      } else {
+        console.error('Failed to fetch projects:', projectsRes.reason);
+        errorMsgs.push('Gagal memuat data portofolio.');
+        hasError = true;
+      }
+
+      if (hasError) {
+        setError(errorMsgs.join(' '));
+      }
+    } catch (err: any) {
+      console.error('Unexpected error loading API data:', err);
+      setError('Terjadi kesalahan yang tidak terduga saat memuat data.');
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  useEffect(() => {
+    loadData();
+  }, []);
+
+  return (
+    <DataContext.Provider
+      value={{
+        achievements,
+        projects,
+        loading,
+        error,
+        refetch: loadData,
+      }}
+    >
+      {children}
+    </DataContext.Provider>
+  );
+}
+
+export function useData() {
+  const context = useContext(DataContext);
+  if (context === undefined) {
+    throw new Error('useData must be used within a DataProvider');
+  }
+  return context;
+}

groups/ACAAB/src/context/LanguageContext.tsx

@@ -0,0 +1,49 @@
+import { createContext, useContext, useState, useEffect, type ReactNode } from 'react';
+import { translations, type Lang, type Translations } from '../i18n';
+
+const KIT_STORAGE_KEY = 'if_untan_lang';
+
+function readKitLang(): Lang {
+  const saved = localStorage.getItem(KIT_STORAGE_KEY);
+  if (saved === 'en') return 'en';
+  const browser = (navigator.language || 'id').toLowerCase();
+  return browser.startsWith('en') ? 'en' : 'id';
+}
+
+interface LanguageContextType {
+  lang: Lang;
+  t: Translations;
+  toggleLang: () => void;
+}
+
+const LanguageContext = createContext<LanguageContextType | null>(null);
+
+export function LanguageProvider({ children }: { children: ReactNode }) {
+  const [lang, setLang] = useState<Lang>(readKitLang);
+
+  // Sync dengan kit's language toggle (tombol ID/EN di navbar)
+  useEffect(() => {
+    const handler = (e: Event) => {
+      const detail = (e as CustomEvent<{ lang: string }>).detail;
+      if (detail?.lang === 'en' || detail?.lang === 'id') {
+        setLang(detail.lang as Lang);
+      }
+    };
+    document.addEventListener('languageChanged', handler);
+    return () => document.removeEventListener('languageChanged', handler);
+  }, []);
+
+  const toggleLang = () => setLang((prev) => (prev === 'id' ? 'en' : 'id'));
+
+  return (
+    <LanguageContext.Provider value={{ lang, t: translations[lang], toggleLang }}>
+      {children}
+    </LanguageContext.Provider>
+  );
+}
+
+export function useLang() {
+  const ctx = useContext(LanguageContext);
+  if (!ctx) throw new Error('useLang must be used within LanguageProvider');
+  return ctx;
+}