Progres dan Bursa Investasi

# fix:
- Bar progres berfungsi
- Urutan bursa investasi
# No issue

src/app_modules/investasi/status_pesanan/layout.tsx

@@ -0,0 +1,30 @@
+"use client";
+
+import HeaderTamplate from "@/app_modules/component/header_tamplate";
+import { ActionIcon, AppShell, Group, Header, Text } from "@mantine/core";
+import { IconArrowLeft } from "@tabler/icons-react";
+import router from "next/router";
+import { title } from "process";
+import React from "react";
+
+export default function LayoutStatusPesananInvestasi({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <>
+      <AppShell
+        header={
+          <Header height={50}>
+            <Group h={50} position="center" px={"md"}>
+              <Text>Status Transaksi</Text>
+            </Group>
+          </Header>
+        }
+      >
+        {children}
+      </AppShell>
+    </>
+  );
+}

src/app_modules/investasi/status_pesanan/view.tsx

@@ -0,0 +1,70 @@
+"use client";
+
+import { useState } from "react";
+import { MODEL_Transaksi_Investasi } from "../model/model_investasi";
+import { Button, Group, Paper, Stack, Text } from "@mantine/core";
+import { useRouter } from "next/navigation";
+import { RouterInvestasi } from "@/app/lib/router_hipmi/router_investasi";
+
+export default function StatusPesananInvetsatsi({
+  dataTransaksi,
+}: {
+  dataTransaksi: MODEL_Transaksi_Investasi;
+}) {
+    const router = useRouter()
+  const [transaksi, setTransaksi] = useState(dataTransaksi);
+  
+  return (
+    <>
+      <Stack>
+        <Paper withBorder p={"md"}>
+          <Stack>
+            <Stack spacing={0}>
+              <Text fw={"bold"}>Pemilik Investasi</Text>
+              <Text>{transaksi.Investasi.author.username}</Text>
+            </Stack>
+            <Stack spacing={0}>
+              <Text fw={"bold"}>Nomor Telephone</Text>
+              <Text>{transaksi.Investasi.author.nomor}</Text>
+            </Stack>
+            <Stack spacing={0}>
+              <Text fw={"bold"}>Nama Proyek Investasi </Text>
+              <Text>{transaksi.Investasi.title}</Text>
+            </Stack>
+          </Stack>
+        </Paper>
+        <Paper withBorder p={"md"}>
+          <Stack>
+            <Stack spacing={0}>
+              <Text fw={"bold"}>Transaksi ID</Text>
+              <Text>{transaksi.transaction_id}</Text>
+            </Stack>
+            <Stack spacing={0}>
+              <Text fw={"bold"}>Lembar Terbeli</Text>
+              <Text>{new Intl.NumberFormat("id-ID").format(+transaksi.quantity)} lembar</Text>
+            </Stack>
+            <Stack spacing={0}>
+              <Text fw={"bold"}>Total Transfer</Text>
+              <Text>Rp. {new Intl.NumberFormat("id-ID", {maximumFractionDigits: 10}).format(+transaksi.gross_amount)}</Text>
+            </Stack>
+            <Stack spacing={0}>
+              <Text fw={"bold"}>Tipe Pembayaran</Text>
+              <Text>{transaksi.payment_type.replace('_', " ")}</Text>
+            </Stack>
+            <Stack spacing={0}>
+              <Text fw={"bold"}>Nama Bank</Text>
+              <Text>{transaksi.namaBank}</Text>
+            </Stack>
+            <Stack spacing={0}>
+              <Text fw={"bold"}>Status Pembayaran</Text>
+              <Text>{transaksi.status_message}</Text>
+            </Stack>
+          </Stack>
+        </Paper>
+        <Button radius={"xl"} onClick={() => router.push(RouterInvestasi.main_transaksi)}>
+            Kembali ke List Transaksi
+        </Button>
+      </Stack>
+    </>
+  );
+}