Files
mobile-darmasaba/lib/useGuide.ts
amaliadwiy 7341f378dd feat: tambah sistem guide onboarding per fitur dengan GuideOverlay
- Buat komponen GuideOverlay dengan animasi fade+slide, arrow tooltip, dan dot indicator
- Buat hook useGuide untuk menyimpan state guide per fitur via AsyncStorage
- Sentralisasi semua step guide di lib/guideSteps.ts
- Pasang guide pada 12 halaman: village-calendar, project detail, banner, group, position, member, announcement, discussion, division calendar/document/discussion, dan division task detail
- Posisi card menggunakan cardTopRatio (rasio layar) untuk kompatibilitas berbagai ukuran device
- Tambah styles guide dan village calendar di constants/Styles.ts
2026-05-11 16:34:46 +08:00

29 lines
789 B
TypeScript

import AsyncStorage from '@react-native-async-storage/async-storage';
import { useEffect, useState } from 'react';
const KEY_PREFIX = '@guide:';
export function useGuide(featureKey: string) {
const [visible, setVisible] = useState(false);
const [checked, setChecked] = useState(false);
useEffect(() => {
AsyncStorage.getItem(KEY_PREFIX + featureKey).then((val) => {
if (!val) setVisible(true);
setChecked(true);
});
}, [featureKey]);
async function dismiss() {
setVisible(false);
await AsyncStorage.setItem(KEY_PREFIX + featureKey, 'done');
}
async function reset() {
await AsyncStorage.removeItem(KEY_PREFIX + featureKey);
setVisible(true);
}
return { visible: checked && visible, dismiss, reset };
}