From b7e774a5565df276230070da88b2111471281381 Mon Sep 17 00:00:00 2001 From: Bagasbanuna02 Date: Wed, 9 Jul 2025 15:03:41 +0800 Subject: [PATCH] fix deskripsi: - perubahan pada component: ButtonCustom, TextArea, TextInput - fix style global - tambhan color pada palet --- app.json | 2 +- .../(user)/portofolio/[id]/create.tsx | 44 +++++++++++------- .../(user)/profile/[id]/create.tsx | 16 +++++-- .../(user)/profile/[id]/update-background.tsx | 46 +++++++++++-------- .../(user)/profile/[id]/update-photo.tsx | 44 +++++++++++------- components/Button/ButtonCustom.tsx | 26 +++++------ components/Button/ButtonUpload.tsx | 21 --------- components/Button/buttonCustomStyles.ts | 13 ++---- components/Select/SelectCustom.tsx | 19 ++++++-- components/TextArea/TextAreaCustom.tsx | 2 +- components/TextInput/TextInputCustom.tsx | 18 ++++++-- components/index.ts | 6 +-- constants/color-palet.ts | 11 +++-- styles/global-styles.ts | 43 ++++++++++++----- 14 files changed, 178 insertions(+), 133 deletions(-) delete mode 100644 components/Button/ButtonUpload.tsx diff --git a/app.json b/app.json index ac01184..d60b54e 100644 --- a/app.json +++ b/app.json @@ -1,6 +1,6 @@ { "expo": { - "name": "hipmi-mobile", + "name": "HIPMI BADUNG", "slug": "hipmi-mobile", "version": "1.0.0", "orientation": "portrait", diff --git a/app/(application)/(user)/portofolio/[id]/create.tsx b/app/(application)/(user)/portofolio/[id]/create.tsx index 80cf9ea..38fc5b4 100644 --- a/app/(application)/(user)/portofolio/[id]/create.tsx +++ b/app/(application)/(user)/portofolio/[id]/create.tsx @@ -1,24 +1,23 @@ -/* eslint-disable @typescript-eslint/no-unused-vars */ import { - BoxButtonOnFooter, - ButtonCenteredOnly, - ButtonCustom, - Grid, - InformationBox, - LandscapeFrameUploaded, - SelectCustom, - Spacing, - StackCustom, - TextAreaCustom, - TextCustom, - TextInputCustom, - ViewWrapper, + BoxButtonOnFooter, + ButtonCenteredOnly, + ButtonCustom, + Grid, + InformationBox, + LandscapeFrameUploaded, + SelectCustom, + Spacing, + StackCustom, + TextAreaCustom, + TextCustom, + TextInputCustom, + ViewWrapper, } from "@/components"; import { MainColor } from "@/constants/color-palet"; import dummyMasterBidangBisnis from "@/lib/dummy-data/master-bidang-bisnis"; import dummyMasterSubBidangBisnis from "@/lib/dummy-data/master-sub-bidang-bisnis"; import { Ionicons } from "@expo/vector-icons"; -import { useLocalSearchParams } from "expo-router"; +import { router, useLocalSearchParams } from "expo-router"; import { useState } from "react"; import { Text, TouchableOpacity, View } from "react-native"; import PhoneInput, { ICountry } from "react-native-international-phone-number"; @@ -60,11 +59,13 @@ export default function PortofolioCreate() { ({ @@ -80,6 +81,7 @@ export default function PortofolioCreate() { ({ @@ -145,12 +147,22 @@ export default function PortofolioCreate() { maxLength={100} /> + + {/* Logo */} - console.log("upload")}> + { + console.log("Upload logo >>", id); + router.navigate(`/(application)/take-picture/${id}`); + }} + > Upload + + {/* Social Media */} - router.navigate(`/take-picture/${id}`)} - /> + > + Upload + @@ -58,9 +61,12 @@ export default function CreateProfile() { - router.navigate(`/take-picture/${id}`)} - /> + > + Upload + diff --git a/app/(application)/(user)/profile/[id]/update-background.tsx b/app/(application)/(user)/profile/[id]/update-background.tsx index 1859676..7de2220 100644 --- a/app/(application)/(user)/profile/[id]/update-background.tsx +++ b/app/(application)/(user)/profile/[id]/update-background.tsx @@ -1,25 +1,31 @@ -import { BaseBox, ButtonCustom } from "@/components"; +import { + BaseBox, + BoxButtonOnFooter, + ButtonCenteredOnly, + ButtonCustom, +} from "@/components"; import ViewWrapper from "@/components/_ShareComponent/ViewWrapper"; -import ButtonUpload from "@/components/Button/ButtonUpload"; import DUMMY_IMAGE from "@/constants/dummy-image-value"; import { router, useLocalSearchParams } from "expo-router"; import { Image } from "react-native"; export default function UpdateBackgroundProfile() { const { id } = useLocalSearchParams(); + const buttonFooter = ( + + { + console.log("Simpan foto background >>", id); + router.back(); + }} + > + Simpan + + + ); + return ( - { - console.log("Simpan foto background >>", id); - router.back(); - }} - > - Simpan - - } - > + @@ -30,12 +36,12 @@ export default function UpdateBackgroundProfile() { /> - - router.navigate(`/(application)/take-picture/${id}`) - } - /> + router.navigate(`/(application)/take-picture/${id}`)} + > + Update + ); } diff --git a/app/(application)/(user)/profile/[id]/update-photo.tsx b/app/(application)/(user)/profile/[id]/update-photo.tsx index 674ab6d..70d2b4c 100644 --- a/app/(application)/(user)/profile/[id]/update-photo.tsx +++ b/app/(application)/(user)/profile/[id]/update-photo.tsx @@ -1,25 +1,30 @@ -import { BaseBox, ButtonCustom } from "@/components"; +import { + BaseBox, + BoxButtonOnFooter, + ButtonCenteredOnly, + ButtonCustom, +} from "@/components"; import ViewWrapper from "@/components/_ShareComponent/ViewWrapper"; -import ButtonUpload from "@/components/Button/ButtonUpload"; import DUMMY_IMAGE from "@/constants/dummy-image-value"; import { router, useLocalSearchParams } from "expo-router"; import { Image } from "react-native"; export default function UpdatePhotoProfile() { const { id } = useLocalSearchParams(); + const buttonFooter = ( + + { + console.log("Simpan foto profile >>", id); + router.back(); + }} + > + Simpan + + + ); return ( - { - console.log("Simpan foto profile >>", id); - router.back(); - }} - > - Simpan - - } - > + @@ -30,13 +35,18 @@ export default function UpdatePhotoProfile() { /> - { console.log("Update photo >>", id); router.navigate(`/(application)/take-picture/${id}`); }} - /> + > + Update + + + {/* + Test */} ); } diff --git a/components/Button/ButtonCustom.tsx b/components/Button/ButtonCustom.tsx index a434525..0cd26f0 100644 --- a/components/Button/ButtonCustom.tsx +++ b/components/Button/ButtonCustom.tsx @@ -2,13 +2,12 @@ import React from "react"; import { StyleProp, Text, TouchableOpacity, ViewStyle } from "react-native"; -import buttonStyles from "./buttonCustomStyles"; import { radiusMap } from "@/constants/radius-value"; import { MainColor } from "@/constants/color-palet"; +import { stylesButton } from "./buttonCustomStyles"; // Import radiusMap - // Definisi type untuk radius type RadiusType = keyof typeof radiusMap | number; @@ -30,30 +29,29 @@ const ButtonCustom: React.FC = ({ title = "Button", backgroundColor = MainColor.yellow, textColor = MainColor.black, - radius = "full", // default md + radius = 50, // default md disabled = false, iconLeft, style, }) => { - const borderRadius = - typeof radius === "number" ? radius : radiusMap[radius ?? "md"]; // fallback ke 'md' - - const styles = buttonStyles({ - backgroundColor, - textColor, - borderRadius, - }); - return ( {/* Render icon jika tersedia */} {iconLeft && iconLeft} - {children || title} + + {children || title} + ); }; diff --git a/components/Button/ButtonUpload.tsx b/components/Button/ButtonUpload.tsx deleted file mode 100644 index 1ab4fa9..0000000 --- a/components/Button/ButtonUpload.tsx +++ /dev/null @@ -1,21 +0,0 @@ -import { MainColor } from "@/constants/color-palet"; -import { GStyles } from "@/styles/global-styles"; -import { Feather } from "@expo/vector-icons"; -import React from "react"; -import ButtonCustom from "./ButtonCustom"; - -interface ButtonUploadProps { - title?: string; - onPress: () => void; -} -export default function ButtonUpload({ onPress, title = "Upload" }: ButtonUploadProps) { - return ( - } - style={GStyles.buttonCentered50Percent} - > - {title} - - ); -} diff --git a/components/Button/buttonCustomStyles.ts b/components/Button/buttonCustomStyles.ts index 274f772..3c19e6d 100644 --- a/components/Button/buttonCustomStyles.ts +++ b/components/Button/buttonCustomStyles.ts @@ -4,24 +4,18 @@ import { MainColor } from "@/constants/color-palet"; import { TEXT_SIZE_MEDIUM } from "@/constants/constans-value"; import { StyleSheet } from "react-native"; -export default function buttonStyles({ - backgroundColor = "#007AFF", - textColor = "#FFFFFF", - borderRadius = 8, -}) { - return StyleSheet.create({ +export const stylesButton = StyleSheet.create({ button: { - backgroundColor, + backgroundColor: MainColor.yellow, paddingVertical: 12, paddingHorizontal: 20, - borderRadius, flexDirection: "row", // 👈 Tambahkan baris ini alignItems: "center", justifyContent: "center", gap: 8, }, buttonText: { - color: textColor, + color: MainColor.black, fontSize: TEXT_SIZE_MEDIUM, fontWeight: "600", }, @@ -29,4 +23,3 @@ export default function buttonStyles({ backgroundColor: MainColor.disabled, }, }); -} diff --git a/components/Select/SelectCustom.tsx b/components/Select/SelectCustom.tsx index c1b32e5..eb30a79 100644 --- a/components/Select/SelectCustom.tsx +++ b/components/Select/SelectCustom.tsx @@ -7,7 +7,7 @@ import { Pressable, Text, TouchableOpacity, - View + View, } from "react-native"; type SelectItem = { @@ -21,6 +21,7 @@ type SelectProps = { data: SelectItem[]; value?: string | number | null; required?: boolean; // <-- new prop + disabled?: boolean; // <-- tambahkan prop disabled onChange: (value: string | number) => void; borderRadius?: number; }; @@ -31,6 +32,7 @@ const SelectCustom: React.FC = ({ data, value, required = false, // <-- default false + disabled = false, // <-- default false onChange, borderRadius = 8, }) => { @@ -51,13 +53,22 @@ const SelectCustom: React.FC = ({ setModalVisible(true)} + onPress={() => !disabled && setModalVisible(true)} > {selectedItem?.label || placeholder} diff --git a/components/TextArea/TextAreaCustom.tsx b/components/TextArea/TextAreaCustom.tsx index cc3cb8f..2058a51 100644 --- a/components/TextArea/TextAreaCustom.tsx +++ b/components/TextArea/TextAreaCustom.tsx @@ -87,7 +87,7 @@ const TextAreaCustom: React.FC = ({ {iconLeft && ( {renderIcon(iconLeft)} )}