rama/halobestie-clone
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Phase 5.x payment catalog + customer-app splash/register polish

Browse Source 
Payment catalog (Phase 5.x — see requirement/phase5-payment-catalog-plan.md):
- New tables payment_method_groups + payment_methods with seed (3 groups,
  10 methods; GoPay seeded inactive pending Xendit channel confirmation).
- payment-catalog.service.js with two-layer cache (60s in-process + 1h
  Valkey) and config:invalidate pub/sub fanout. Mutator API + casing-
  tolerant findActiveMethodByCode for downstream validation.
- App-facing GET /api/client/payment-methods returns pre-grouped JSON,
  active-only, empty groups dropped server-side.
- POST /api/client/payment-requests now validates `method` against the
  catalog (INVALID_PAYMENT_METHOD 422) and stamps
  product_metadata.preferred_payment_code (upper-cased).
- Control-center /internal/payment-{groups,methods}{,/:id,/reorder}
  endpoints (full CRUD + idempotent reorder). New Payment Catalog page
  wired into the CC nav.
- Customer app renders the catalog as collapsible groups (first expanded)
  via paymentCatalogProvider; QRIS-only hardcoded fallback on 5xx so
  checkout never hard-fails. Replaces the hardcoded _PayMethod enum.
- 10 brand SVGs (~63KB) bundled in client_app/assets/payment_icons/ from
  github.com/hafidznoor/idn-finlogos. Xendit's per-channel media-asset
  pages were planned but found decommissioned during implementation —
  switched to idn-finlogos with the standard "channels-we-accept"
  trademark posture. See assets/payment_icons/README.md for the workflow
  to add new methods.
- 16 vitest cases covering the service + cache; full backend suite green
  (162/162).

Customer-app splash + register polish:
- Splash rewritten per figma S1: warm vertical gradient, two ImageFiltered
  radial orbs, 96×96 rounded-square logo tile, "HaloBestie" + "kamu gak
  harus ngerasain ini sendirian." Self-driving navigation via context.go
  after a 2.5s post-frame timer (native Android splash burns ~1-1.5s
  before Flutter paints — 1s timer yielded near-zero visible duration).
  Router early-returns null for isSplash so it never moves us off /splash
  on its own.
- 3-page onboarding carousel removed: user clarified the new splash
  REPLACES that carousel. Dropped /onboarding route, OnboardingScreen,
  onboardingDoneProvider + gating, dead splash_{1,2,3}.png + the
  splash_chat_hebat.png Flutter asset. Phase 4 /onboarding/* subroutes
  untouched; Android-native launch_background drawable left alone.
- Register screen (login-by-phone) polished: circular pink back button +
  72×72 logo badge (same brandLogoBg pink as splash, Transform.scale 1.4
  to fill the tile). Step-dots indicator removed.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Ramadhan Sjamsani
2026-05-26 23:06:46 +08:00
parent d60c048776
commit 1f6d8e09ae
39 changed files with 2634 additions and 370 deletions
Download Patch File Download Diff File Expand all files Collapse all files

210
client_app/lib/features/onboarding/onboarding_screen.dart
View File

@@ -1,210 +0,0 @@
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:go_router/go_router.dart';
import 'package:shared_preferences/shared_preferences.dart';
import '../../router.dart';
const _kOnboardingDone = 'onboarding_done';
const _kPink = Color(0xFFBE7C8A);
class _OnboardingPage {
final String title;
final String text;
final String image;
const _OnboardingPage({
required this.title,
required this.text,
required this.image,
});
}
const _pages = [
_OnboardingPage(
title: 'Langsung Curhat',
text: 'Tidak perlu form panjang atau janji. Masuk dan langsung ngobrol.',
image: 'assets/images/splash/splash_1.png',
),
_OnboardingPage(
title: '100% Anonim',
text: 'Identitas kamu tidak akan ditampilkan. Cerita dengan tenang, tanpa khawatir.',
image: 'assets/images/splash/splash_2.png',
),
_OnboardingPage(
title: 'Bestie yang Relevan',
text: 'Kamu akan dipasangkan dengan bestie berdasarkan topik & kondisi kamu saat ini.',
image: 'assets/images/splash/splash_3.png',
),
];
class OnboardingScreen extends ConsumerStatefulWidget {
const OnboardingScreen({super.key});
@override
ConsumerState<OnboardingScreen> createState() => _OnboardingScreenState();
}
class _OnboardingScreenState extends ConsumerState<OnboardingScreen> {
final _controller = PageController();
int _currentPage = 0;
@override
void initState() {
super.initState();
// Auto-advance: page 0 → 1 after 500ms
_scheduleAutoAdvance(0);
}
@override
void dispose() {
_controller.dispose();
super.dispose();
}
void _scheduleAutoAdvance(int fromPage) {
// Only auto-advance for pages 0 and 1
if (fromPage >= 2) return;
Future.delayed(const Duration(seconds: 1), () {
if (mounted && _currentPage == fromPage) {
_controller.nextPage(
duration: const Duration(milliseconds: 300),
curve: Curves.easeInOut,
);
}
});
}
void _onPageChanged(int index) {
setState(() => _currentPage = index);
_scheduleAutoAdvance(index);
}
Future<void> _finish() async {
final prefs = await SharedPreferences.getInstance();
await prefs.setBool(_kOnboardingDone, true);
ref.invalidate(onboardingDoneProvider);
if (mounted) {
context.go('/home');
}
}
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.white,
body: SafeArea(
child: Column(
children: [
Expanded(
child: PageView.builder(
controller: _controller,
itemCount: _pages.length,
onPageChanged: _onPageChanged,
physics: const NeverScrollableScrollPhysics(),
itemBuilder: (context, index) {
final page = _pages[index];
return _buildPage(page);
},
),
),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 32),
child: Row(
children: [
// Page indicators
Row(
children: List.generate(_pages.length, (index) {
final isActive = index == _currentPage;
return Container(
margin: const EdgeInsets.only(right: 8),
width: isActive ? 32 : 12,
height: 6,
decoration: BoxDecoration(
color: isActive ? _kPink : _kPink.withValues(alpha: 0.3),
borderRadius: BorderRadius.circular(3),
),
);
}),
),
const Spacer(),
// CTA button — only show "Mulai" on last page
if (_currentPage == _pages.length - 1)
GestureDetector(
onTap: _finish,
child: Container(
height: 56,
padding: const EdgeInsets.symmetric(horizontal: 32),
decoration: BoxDecoration(
color: _kPink,
borderRadius: BorderRadius.circular(16),
),
child: const Center(
child: Text(
'Mulai',
style: TextStyle(
color: Colors.white,
fontSize: 16,
fontWeight: FontWeight.bold,
),
),
),
),
),
],
),
),
],
),
),
);
}
Widget _buildPage(_OnboardingPage page) {
return Padding(
padding: const EdgeInsets.symmetric(horizontal: 24),
child: Column(
children: [
const Spacer(flex: 1),
// Image
Padding(
padding: const EdgeInsets.symmetric(horizontal: 16),
child: Image.asset(
page.image,
height: 280,
fit: BoxFit.contain,
),
),
const Spacer(flex: 1),
// Title
Text(
page.title,
style: const TextStyle(
fontSize: 24,
fontWeight: FontWeight.bold,
color: _kPink,
),
textAlign: TextAlign.center,
),
const SizedBox(height: 16),
// Description
Text(
page.text,
style: TextStyle(
fontSize: 16,
color: Colors.pink.shade300,
height: 1.5,
),
textAlign: TextAlign.center,
),
const Spacer(flex: 1),
],
),
);
}
}
/// Check if onboarding has been completed
Future<bool> isOnboardingDone() async {
final prefs = await SharedPreferences.getInstance();
return prefs.getBool(_kOnboardingDone) ?? false;
}