feat: Add default contentPadding to NewWrapper_V2
- Set default contentPadding to 16px for consistent spacing - Added contentPadding prop to BaseProps interface - Updated documentation in TASK-004 Benefits: - All screens automatically have 16px padding - Cleaner code (no need to specify padding everywhere) - Still customizable (set to 0 or custom value if needed) - Box content not too tight to screen edges Phase 1 completed with consistent padding! Co-authored-by: Qwen-Coder <qwen-coder@alibabacloud.com>
This commit is contained in:
@@ -44,6 +44,11 @@ interface BaseProps {
|
|||||||
* Extra padding bottom for content to avoid navigation bar (default: 80)
|
* Extra padding bottom for content to avoid navigation bar (default: 80)
|
||||||
*/
|
*/
|
||||||
contentPaddingBottom?: number;
|
contentPaddingBottom?: number;
|
||||||
|
/**
|
||||||
|
* Padding untuk content container (default: 16)
|
||||||
|
* Set to 0 untuk tidak ada padding, atau custom value sesuai kebutuhan
|
||||||
|
*/
|
||||||
|
contentPadding?: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
interface StaticModeProps extends BaseProps {
|
interface StaticModeProps extends BaseProps {
|
||||||
@@ -78,6 +83,7 @@ export function NewWrapper_V2(props: NewWrapper_V2_Props) {
|
|||||||
enableKeyboardHandling = false,
|
enableKeyboardHandling = false,
|
||||||
keyboardScrollOffset = 100,
|
keyboardScrollOffset = 100,
|
||||||
contentPaddingBottom = 80, // Default 80 untuk navigasi device
|
contentPaddingBottom = 80, // Default 80 untuk navigasi device
|
||||||
|
contentPadding = 16, // Default 16 untuk padding konsisten
|
||||||
} = props;
|
} = props;
|
||||||
|
|
||||||
const assetBackground = require("../../assets/images/main-background.png");
|
const assetBackground = require("../../assets/images/main-background.png");
|
||||||
@@ -132,6 +138,7 @@ export function NewWrapper_V2(props: NewWrapper_V2_Props) {
|
|||||||
contentContainerStyle={{
|
contentContainerStyle={{
|
||||||
flexGrow: 1,
|
flexGrow: 1,
|
||||||
paddingBottom: (footerComponent && !hideFooter ? OS_HEIGHT : 0) + contentPaddingBottom,
|
paddingBottom: (footerComponent && !hideFooter ? OS_HEIGHT : 0) + contentPaddingBottom,
|
||||||
|
padding: contentPadding,
|
||||||
}}
|
}}
|
||||||
keyboardShouldPersistTaps="handled"
|
keyboardShouldPersistTaps="handled"
|
||||||
/>
|
/>
|
||||||
@@ -180,6 +187,7 @@ export function NewWrapper_V2(props: NewWrapper_V2_Props) {
|
|||||||
contentContainerStyle={{
|
contentContainerStyle={{
|
||||||
flexGrow: 1,
|
flexGrow: 1,
|
||||||
paddingBottom: (footerComponent && !hideFooter ? OS_HEIGHT : 0) + contentPaddingBottom,
|
paddingBottom: (footerComponent && !hideFooter ? OS_HEIGHT : 0) + contentPaddingBottom,
|
||||||
|
padding: contentPadding,
|
||||||
}}
|
}}
|
||||||
keyboardShouldPersistTaps="handled"
|
keyboardShouldPersistTaps="handled"
|
||||||
showsVerticalScrollIndicator={false}
|
showsVerticalScrollIndicator={false}
|
||||||
|
|||||||
@@ -213,7 +213,7 @@ import { View } from "react-native";
|
|||||||
|
|
||||||
| Phase | Screens | Status | Completed Date |
|
| Phase | Screens | Status | Completed Date |
|
||||||
|-------|---------|--------|----------------|
|
|-------|---------|--------|----------------|
|
||||||
| **Phase 1: Job** | 2 screens | 🟡 In Progress | - |
|
| **Phase 1: Job** | 6 screens | ✅ COMPLETED | 2026-04-01 |
|
||||||
| **Phase 2: Event & Profile** | 4 screens | ⏳ Pending | - |
|
| **Phase 2: Event & Profile** | 4 screens | ⏳ Pending | - |
|
||||||
| **Phase 3: Forms** | 6-8 screens | ⏳ Pending | - |
|
| **Phase 3: Forms** | 6-8 screens | ⏳ Pending | - |
|
||||||
| **Phase 4: Complex** | 4-6 screens | ⏳ Pending | - |
|
| **Phase 4: Complex** | 4-6 screens | ⏳ Pending | - |
|
||||||
@@ -221,6 +221,41 @@ import { View } from "react-native";
|
|||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
|
## ✅ Phase 1: COMPLETED!
|
||||||
|
|
||||||
|
**Migrated Screens:**
|
||||||
|
1. ✅ `screens/Job/ScreenJobCreate.tsx` - Form with keyboard handling
|
||||||
|
2. ✅ `screens/Job/ScreenJobEdit.tsx` - Form with keyboard handling
|
||||||
|
3. ✅ `screens/Job/ScreenBeranda2.tsx` - List (no keyboard handling needed)
|
||||||
|
4. ✅ `screens/Job/ScreenArchive2.tsx` - List (no keyboard handling needed)
|
||||||
|
5. ✅ `screens/Job/MainViewStatus2.tsx` - List (no keyboard handling needed)
|
||||||
|
6. ✅ `app/(application)/(user)/job/[id]/[status]/detail.tsx` - Detail (no keyboard handling needed)
|
||||||
|
|
||||||
|
**Test Files Deleted:**
|
||||||
|
- ❌ `screens/Job/ScreenJobCreate2.tsx`
|
||||||
|
- ❌ `screens/Job/ScreenJobEdit2.tsx`
|
||||||
|
- ❌ `components/_ShareComponent/TestWrapper.tsx`
|
||||||
|
- ❌ `components/_ShareComponent/TestKeyboardInput.tsx`
|
||||||
|
- ❌ `app/(application)/(user)/test-keyboard.tsx`
|
||||||
|
- ❌ `app/(application)/(user)/test-keyboard-bug.tsx`
|
||||||
|
|
||||||
|
**Routes Updated:**
|
||||||
|
- ✅ `app/(application)/(user)/job/create.tsx` → Uses ScreenJobCreate
|
||||||
|
- ✅ `app/(application)/(user)/job/[id]/edit.tsx` → Uses ScreenJobEdit
|
||||||
|
- ✅ `app/(application)/(user)/job/(tabs)/index.tsx` → Uses ScreenBeranda2
|
||||||
|
- ✅ `app/(application)/(user)/job/(tabs)/archive.tsx` → Uses ScreenArchive2
|
||||||
|
- ✅ `app/(application)/(user)/job/(tabs)/status.tsx` → Uses MainViewStatus2
|
||||||
|
- ✅ `app/(application)/(user)/job/[id]/[status]/detail.tsx` → Migrated to NewWrapper_V2
|
||||||
|
|
||||||
|
**Commits:**
|
||||||
|
- `a9ff755` - feat: Migrate Job screens to NewWrapper_V2
|
||||||
|
- `0f55244` - refactor: Cleanup test files and migrate Job Detail
|
||||||
|
- `7cb4f30` - refactor: Replace NewWrapper with NewWrapper_V2 for all Job screens
|
||||||
|
|
||||||
|
**Total:** 6 screens migrated, 6 test files deleted, 6 routes updated
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
## 🚀 Current Status
|
## 🚀 Current Status
|
||||||
|
|
||||||
**Status**: 🟡 IN PROGRESS
|
**Status**: 🟡 IN PROGRESS
|
||||||
|
|||||||
Reference in New Issue
Block a user