Job

Add : app/(application)/(user)/job/[id]/

Fix:
-  app/(application)/(user)/job/(tabs)/archive.tsx
-  app/(application)/(user)/job/(tabs)/index.tsx
-  app/(application)/(user)/job/(tabs)/status.tsx
-  app/(application)/(user)/job/create.tsx

Package:
Add: expo-clipboard

# No Issue

app/(application)/(user)/_layout.tsx

@@ -162,6 +162,13 @@ export default function UserLayout() {
           name="job/(tabs)"
           options={{
             title: "Job Vacancy",
+            headerLeft: () => <BackButton path="/home" />,
+          }}
+        />
+        <Stack.Screen
+          name="job/[id]/index"
+          options={{
+            title: "Detail Lowongan Pekerjaan",
             headerLeft: () => <BackButton />,
           }}
         />

app/(application)/(user)/job/(tabs)/archive.tsx

@@ -1,9 +1,16 @@
-import { TextCustom, ViewWrapper } from "@/components";
+import { BaseBox, TextCustom, ViewWrapper } from "@/components";
+import { jobDataDummy } from "@/screens/Job/listDataDummy";
 
 export default function JobArchive() {
   return (
     <ViewWrapper>
-      <TextCustom>Job Archive</TextCustom>
+      {jobDataDummy.map((e, i) => (
+        <BaseBox key={i} paddingBlock={20}>
+          <TextCustom align="center" bold truncate size="large">
+            {e.posisi}
+          </TextCustom>
+        </BaseBox>
+      ))}
     </ViewWrapper>
   );
 }

app/(application)/(user)/job/(tabs)/index.tsx

@@ -20,7 +20,7 @@ export default function JobBeranda() {
       headerComponent={<SearchInput placeholder="Cari pekerjaan" />}
     >
       {jobDataDummy.map((item, index) => (
-        <BoxWithHeaderSection key={index}>
+        <BoxWithHeaderSection key={index} onPress={() => router.push(`/job/${item.id}`)}>
           <AvatarUsernameAndOtherComponent avatarHref={`/profile/${item.id}`} />
           <Spacing />
           <TextCustom truncate={2} align="center" bold size="large">

app/(application)/(user)/job/(tabs)/status.tsx

@@ -1,9 +1,44 @@
-import { TextCustom, ViewWrapper } from "@/components";
+import {
+  BaseBox,
+  ScrollableCustom,
+  TextCustom,
+  ViewWrapper,
+} from "@/components";
+import { masterStatus } from "@/lib/dummy-data/_master/status";
+import { jobDataDummy } from "@/screens/Job/listDataDummy";
+import { useState } from "react";
 
 export default function JobStatus() {
+  const [activeCategory, setActiveCategory] = useState<string | null>(
+    "publish"
+  );
+
+  const handlePress = (item: any) => {
+    setActiveCategory(item.value);
+    // tambahkan logika lain seperti filter dsb.
+  };
+
+  const scrollComponent = (
+    <ScrollableCustom
+      data={masterStatus.map((e, i) => ({
+        id: i,
+        label: e.label,
+        value: e.value,
+      }))}
+      onButtonPress={handlePress}
+      activeId={activeCategory as any}
+    />
+  );
+
   return (
-    <ViewWrapper>
+    <ViewWrapper headerComponent={scrollComponent} hideFooter>
-      <TextCustom>Job Status</TextCustom>
+      {jobDataDummy.map((e, i) => (
+        <BaseBox key={i} paddingBlock={20}>
+          <TextCustom align="center" bold truncate size="large">
+            {activeCategory?.toUpperCase()} {e.posisi}
+          </TextCustom>
+        </BaseBox>
+      ))}
     </ViewWrapper>
   );
 }

app/(application)/(user)/job/[id]/index.tsx

@@ -0,0 +1,95 @@
+import {
+  BaseBox,
+  ButtonCustom,
+  Spacing,
+  StackCustom,
+  TextCustom,
+  ViewWrapper,
+} from "@/components";
+import { ICON_SIZE_SMALL } from "@/constants/constans-value";
+import { jobDataDummy } from "@/screens/Job/listDataDummy";
+import { Ionicons } from "@expo/vector-icons";
+import { useLocalSearchParams } from "expo-router";
+import { Alert, Linking } from "react-native";
+import * as Clipboard from "expo-clipboard";
+import { MainColor } from "@/constants/color-palet";
+
+export default function JobDetail() {
+  const { id } = useLocalSearchParams();
+
+  const jobDetail = jobDataDummy.find((e) => e.id === Number(id));
+
+  const OpenLinkButton = () => {
+    const jobUrl =
+      "https://stg-hipmi.wibudev.com/job-vacancy/cm6ijt9w8005zucv4twsct657";
+
+    const openInBrowser = async () => {
+      const supported = await Linking.canOpenURL(jobUrl);
+      if (supported) {
+        await Linking.openURL(jobUrl);
+      } else {
+        Alert.alert("Gagal membuka link", "Browser tidak tersedia.");
+      }
+    };
+
+    return (
+      <ButtonCustom
+        iconLeft={<Ionicons name="globe" size={ICON_SIZE_SMALL} color="white" />}
+        onPress={openInBrowser}
+        backgroundColor="green"
+        textColor="white"
+      >
+        Buka Lowongan di Browser
+      </ButtonCustom>
+    );
+  };
+
+  const CopyLinkButton = () => {
+    const jobUrl =
+      "https://stg-hipmi.wibudev.com/job-vacancy/cm6ijt9w8005zucv4twsct657";
+
+    const copyToClipboard = async () => {
+      await Clipboard.setStringAsync(jobUrl);
+      Alert.alert(
+        "Link disalin",
+        "Tautan lowongan telah disalin ke clipboard."
+      );
+    };
+
+    return (
+      <ButtonCustom
+        iconLeft={<Ionicons name="copy" size={ICON_SIZE_SMALL} color="white" />}
+        onPress={copyToClipboard}
+        backgroundColor={MainColor.orange}
+        textColor="white"
+      >
+        Salin Link
+      </ButtonCustom>
+    );
+  };
+
+  return (
+    <ViewWrapper>
+      <BaseBox>
+        <StackCustom gap={"lg"}>
+          <TextCustom align="center" bold size="large">
+            {jobDetail?.posisi}
+          </TextCustom>
+
+          <StackCustom gap={"sm"}>
+            <TextCustom bold>Syarat & Ketentuan :</TextCustom>
+            <TextCustom>{jobDetail?.syaratKetentuan}</TextCustom>
+          </StackCustom>
+
+          <StackCustom gap={"sm"}>
+            <TextCustom bold>Deskripsi :</TextCustom>
+            <TextCustom>{jobDetail?.deskripsi}</TextCustom>
+          </StackCustom>
+        </StackCustom>
+      </BaseBox>
+      <OpenLinkButton />
+      <Spacing/>
+      <CopyLinkButton />
+    </ViewWrapper>
+  );
+}

app/(application)/(user)/job/create.tsx

@@ -1,9 +1,70 @@
-import { TextCustom, ViewWrapper } from "@/components";
+import {
+    ButtonCenteredOnly,
+    ButtonCustom,
+    InformationBox,
+    LandscapeFrameUploaded,
+    Spacing,
+    StackCustom,
+    TextAreaCustom,
+    TextInputCustom,
+    ViewWrapper
+} from "@/components";
+import { router } from "expo-router";
 
 export default function JobCreate() {
+    
+  const buttonSubmit = () => {
+    return (
+      <>
+        <ButtonCustom
+          onPress={() =>
+            router.replace("/(application)/(user)/job/(tabs)/status")
+          }
+        >
+          Simpan
+        </ButtonCustom>
+        <Spacing/>
+      </>
+    );
+  };
+
+
   return (
     <ViewWrapper>
-      <TextCustom>Job Create</TextCustom>
+      <StackCustom gap={"xs"}>
+        <InformationBox text="Poster atau gambar lowongan kerja bersifat opsional, tidak wajib untuk dimasukkan dan upload lah gambar yang sesuai dengan deskripsi lowongan kerja." />
+
+        <LandscapeFrameUploaded />
+        <ButtonCenteredOnly onPress={() => console.log("Upload")} icon="upload">
+          Upload
+        </ButtonCenteredOnly>
+
+        <Spacing />
+
+        <TextInputCustom
+          label="Judul Lowongan"
+          placeholder="Masukan Judul Lowongan Kerja"
+          required
+        />
+
+        <TextAreaCustom
+          label="Syarat & Kualifikasi"
+          placeholder="Masukan Syarat & Kualifikasi Lowongan Kerja"
+          required
+          showCount
+          maxLength={1000}
+        />
+
+        <TextAreaCustom
+          label="Deskripsi Lowongan"
+          placeholder="Masukan Deskripsi Lowongan Kerja"
+          required
+          showCount
+          maxLength={1000}
+        />
+
+        {buttonSubmit()}
+      </StackCustom>
     </ViewWrapper>
   );
 }

bun.lock

@@ -16,6 +16,7 @@
         "expo": "53.0.17",
         "expo-blur": "~14.1.5",
         "expo-camera": "~16.1.10",
+        "expo-clipboard": "~7.1.5",
         "expo-constants": "~17.1.7",
         "expo-font": "~13.3.2",
         "expo-haptics": "~14.1.4",
@@ -827,6 +828,8 @@
 
     "expo-camera": ["expo-camera@16.1.10", "", { "dependencies": { "invariant": "^2.2.4" }, "peerDependencies": { "expo": "*", "react": "*", "react-native": "*", "react-native-web": "*" }, "optionalPeers": ["react-native-web"] }, "sha512-qoRJeSwPmMbuu0VfnQTC+q79Kt2SqTWColEImgithL9u0qUQcC55U89IfhZk55Hpt6f1DgKuDzUOG5oY+snSWg=="],
 
+    "expo-clipboard": ["expo-clipboard@7.1.5", "", { "peerDependencies": { "expo": "*", "react": "*", "react-native": "*" } }, "sha512-TCANUGOxouoJXxKBW5ASJl2WlmQLGpuZGemDCL2fO5ZMl57DGTypUmagb0CVUFxDl0yAtFIcESd78UsF9o64aw=="],
+
     "expo-constants": ["expo-constants@17.1.7", "", { "dependencies": { "@expo/config": "~11.0.12", "@expo/env": "~1.0.7" }, "peerDependencies": { "expo": "*", "react-native": "*" } }, "sha512-byBjGsJ6T6FrLlhOBxw4EaiMXrZEn/MlUYIj/JAd+FS7ll5X/S4qVRbIimSJtdW47hXMq0zxPfJX6njtA56hHA=="],
 
     "expo-file-system": ["expo-file-system@18.1.11", "", { "peerDependencies": { "expo": "*", "react-native": "*" } }, "sha512-HJw/m0nVOKeqeRjPjGdvm+zBi5/NxcdPf8M8P3G2JFvH5Z8vBWqVDic2O58jnT1OFEy0XXzoH9UqFu7cHg9DTQ=="],

package.json

@@ -23,6 +23,7 @@
     "expo": "53.0.17",
     "expo-blur": "~14.1.5",
     "expo-camera": "~16.1.10",
+    "expo-clipboard": "~7.1.5",
     "expo-constants": "~17.1.7",
     "expo-font": "~13.3.2",
     "expo-haptics": "~14.1.4",

screens/Job/listDataDummy.ts

@@ -2,81 +2,81 @@ export const jobDataDummy = [
   {
     id: 1,
     posisi: "Front-End Developer",
-    perusahaan: "PT Teknologi Hebat",
+    deskripsi:
-    lokasi: "Jakarta",
+      "Kami mencari Front-End Developer yang berpengalaman untuk membangun dan mengembangkan antarmuka pengguna web yang interaktif, responsif, dan menarik menggunakan React.js dan TypeScript. Kandidat akan bekerja sama dengan tim desain dan back-end untuk memastikan pengalaman pengguna yang optimal di berbagai perangkat.",
-    deskripsi: "Membangun UI dengan React.js",
+    syaratKetentuan:
-    tanggalDibuka: "2025-07-25",
+      "Minimal 2 tahun pengalaman sebagai Front-End Developer. Menguasai React.js, TypeScript, HTML, CSS (SCSS). Memahami prinsip-prinsip desain responsif dan pengalaman pengguna (UX). Pengalaman dengan Git dan CI/CD pipeline menjadi nilai tambah.",
   },
   {
     id: 2,
     posisi: "Back-End Developer",
-    perusahaan: "PT Solusi Digital",
+    deskripsi:
-    lokasi: "Bandung",
+      "Posisi ini bertanggung jawab dalam membangun dan memelihara RESTful API, serta mengelola logika server dan interaksi dengan basis data. Anda akan bekerja dengan Node.js dan Express untuk mendukung berbagai kebutuhan aplikasi kami yang dinamis dan real-time.",
-    deskripsi: "REST API dengan Node.js & Express",
+    syaratKetentuan:
-    tanggalDibuka: "2025-07-20",
+      "Pengalaman minimal 2 tahun sebagai Back-End Developer. Menguasai Node.js, Express.js, dan basis data (MongoDB, PostgreSQL). Paham prinsip REST API, middleware, dan keamanan data. Pengalaman dengan Docker dan testing (Jest/Mocha) menjadi nilai plus.",
   },
   {
     id: 3,
     posisi: "UI/UX Designer",
-    perusahaan: "StartupKita",
+    deskripsi:
-    lokasi: "Yogyakarta",
+      "Kami mencari desainer kreatif untuk merancang pengalaman pengguna dan antarmuka yang modern dan intuitif. Anda akan terlibat dalam proses riset pengguna, wireframing, prototyping, dan pengujian desain untuk aplikasi web dan mobile.",
-    deskripsi: "Desain aplikasi mobile dengan Figma",
+    syaratKetentuan:
-    tanggalDibuka: "2025-07-15",
+      "Minimal 1 tahun pengalaman dalam UI/UX. Menguasai alat desain seperti Figma, Sketch, atau Adobe XD. Mampu membuat prototipe interaktif dan melakukan usability testing. Portofolio desain UI/UX yang pernah dikerjakan wajib dilampirkan.",
   },
   {
     id: 4,
     posisi: "DevOps Engineer",
-    perusahaan: "Cloudify Indonesia",
+    deskripsi:
-    lokasi: "Remote",
+      "Sebagai DevOps Engineer, Anda akan bertanggung jawab atas deployment otomatis, pemantauan sistem, dan infrastruktur cloud kami. Posisi ini akan fokus pada integrasi dan pengiriman berkelanjutan (CI/CD), skalabilitas, serta keamanan sistem.",
-    deskripsi: "Automasi CI/CD pipeline di AWS",
+    syaratKetentuan:
-    tanggalDibuka: "2025-07-22",
+      "Menguasai Docker, Kubernetes, Jenkins, GitLab CI, dan monitoring tools (Prometheus, Grafana). Memiliki pengalaman kerja dengan platform cloud seperti AWS atau GCP. Familiar dengan scripting Bash/Python dan prinsip keamanan DevOps.",
   },
   {
     id: 5,
     posisi: "Mobile Developer",
-    perusahaan: "AppMaju",
+    deskripsi:
-    lokasi: "Surabaya",
+      "Kami sedang mencari developer mobile yang terampil menggunakan Flutter untuk mengembangkan aplikasi lintas platform (iOS & Android) yang efisien dan user-friendly. Anda akan bekerja dalam tim produk untuk merancang dan mengimplementasikan fitur baru.",
-    deskripsi: "Kembangkan aplikasi Flutter",
+    syaratKetentuan:
-    tanggalDibuka: "2025-07-10",
+      "Pengalaman mengembangkan aplikasi Flutter setidaknya 1 tahun. Memahami state management (Provider, BLoC, atau Riverpod). Pernah merilis aplikasi di Google Play Store atau App Store. Pengalaman dengan Firebase menjadi nilai tambah.",
   },
   {
     id: 6,
     posisi: "Data Analyst",
-    perusahaan: "InsightData",
+    deskripsi:
-    lokasi: "Jakarta",
+      "Sebagai Data Analyst, Anda akan mengumpulkan, menganalisis, dan menginterpretasikan data untuk mendukung keputusan bisnis. Anda akan membuat dashboard interaktif, laporan rutin, dan memberikan insight yang bisa ditindaklanjuti kepada tim manajemen.",
-    deskripsi: "Visualisasi data & dashboard BI",
+    syaratKetentuan:
-    tanggalDibuka: "2025-07-18",
+      "Pengalaman menggunakan SQL, Excel, dan tools visualisasi data seperti Power BI atau Tableau. Kemampuan analisis statistik dan storytelling data. Pengalaman dengan Python (pandas, numpy) merupakan keunggulan.",
   },
   {
     id: 7,
     posisi: "Machine Learning Engineer",
-    perusahaan: "AIWorks",
+    deskripsi:
-    lokasi: "Bandung",
+      "Kami membuka posisi untuk insinyur Machine Learning yang akan mengembangkan dan mengimplementasikan model prediktif untuk mendukung berbagai kebutuhan bisnis. Anda akan bekerja dengan data dalam skala besar dan menerapkan teknik NLP, klasifikasi, dan rekomendasi.",
-    deskripsi: "Model prediktif dengan Python & TensorFlow",
+    syaratKetentuan:
-    tanggalDibuka: "2025-07-05",
+      "Memiliki pengalaman minimal 1 tahun dalam ML project. Menguasai Python, scikit-learn, TensorFlow, atau PyTorch. Mampu memproses data besar dengan pandas, NumPy, dan Spark. Familiar dengan deployment model ML ke production.",
   },
   {
     id: 8,
     posisi: "System Administrator",
-    perusahaan: "NetSecure",
+    deskripsi:
-    lokasi: "Depok",
+      "Posisi ini bertanggung jawab atas pengelolaan dan pemeliharaan sistem server Linux, jaringan internal, dan keamanan TI perusahaan. Termasuk setup server, monitoring, dan troubleshooting sistem operasional harian.",
-    deskripsi: "Maintain server Linux & firewall",
+    syaratKetentuan:
-    tanggalDibuka: "2025-07-08",
+      "Berpengalaman mengelola server Linux (Ubuntu/CentOS), firewall, dan konfigurasi jaringan. Paham konsep load balancing, backup otomatis, dan disaster recovery. Kemampuan scripting (Bash, Python) menjadi nilai tambah.",
   },
   {
     id: 9,
     posisi: "Quality Assurance",
-    perusahaan: "TechTesters",
+    deskripsi:
-    lokasi: "Semarang",
+      "Kami mencari QA Engineer untuk memastikan kualitas produk melalui pengujian manual maupun otomatis. Anda akan menulis test case, menjalankan regresi test, dan bekerja erat dengan tim developer untuk menemukan serta memperbaiki bug lebih awal.",
-    deskripsi: "Manual & automated testing",
+    syaratKetentuan:
-    tanggalDibuka: "2025-07-12",
+      "Pengalaman dalam manual testing dan tools otomasi seperti Selenium, Cypress, atau Playwright. Memahami prinsip SDLC dan metodologi Agile. Mampu menulis dokumentasi QA dan membuat test report secara sistematis.",
   },
   {
     id: 10,
     posisi: "Product Manager",
-    perusahaan: "Inovasi Digital",
+    deskripsi:
-    lokasi: "Remote",
+      "Sebagai Product Manager, Anda akan memimpin pengembangan produk mulai dari perencanaan, peluncuran, hingga peningkatan. Anda akan mengelola roadmap, prioritas fitur, dan bekerja lintas fungsi dengan tim desain, dev, dan bisnis.",
-    deskripsi: "Riset, roadmap, dan koordinasi tim dev",
+    syaratKetentuan:
-    tanggalDibuka: "2025-07-01",
+      "Minimal 2 tahun pengalaman sebagai Product Manager. Memahami Agile/Scrum. Keterampilan komunikasi dan analisis yang kuat. Pengalaman dalam tools seperti Jira, Confluence, dan alat wireframing. Kemampuan mengambil keputusan berbasis data.",
   },
 ];