# style:

- UI Investasi
- UI Donasi
## No issue

src/app_modules/investasi/portofolio/review.tsx

@@ -22,6 +22,7 @@ import {
 } from "../model/model_investasi";
 import _ from "lodash";
 import ComponentInvestasi_IsEmptyData from "../component/is_empty_data";
+import { ComponentInvestasi_CardStatus } from "../component/detail/card_status";
 
 export default function Review({ data }: { data: MODEL_Investasi[] }) {
   const router = useRouter();
@@ -35,40 +36,12 @@ export default function Review({ data }: { data: MODEL_Investasi[] }) {
   return (
     <>
       {data.map((e) => (
-        <Paper
-          // sx={{ borderStyle: "solid", borderColor: "orange", borderWidth: "1px" }}
-          key={e.id}
-          mb={"md"}
-          p={"xs"}
-          withBorder
-          onClick={() => router.push(RouterInvestasi.detail_review + `${e.id}`)}
-        >
-          <Grid>
-            <Grid.Col span={8}>
-              <Text fw={"bold"}> {_.capitalize(e.title)}</Text>
-              <Stack spacing={0}>
-                <Text fz={10}>Target Dana:</Text>
-                <Text>
-                  Rp.{" "}
-                  {new Intl.NumberFormat("id-ID", {
-                    maximumSignificantDigits: 10,
-                  }).format(+e.targetDana)}
-                </Text>
-              </Stack>
-            </Grid.Col>
-
-            <Grid.Col span={4}>
-              <AspectRatio ratio={16 / 9}>
-                <Paper radius={"md"}>
-                  <Image
-                    alt=""
-                    src={RouterInvestasi.api_gambar + `${e.imagesId}`}
-                  />
-                </Paper>
-              </AspectRatio>
-            </Grid.Col>
-          </Grid>
-        </Paper>
+        <Box key={e.id}>
+          <ComponentInvestasi_CardStatus
+            data={e}
+            path={RouterInvestasi.detail_review}
+          />
+        </Box>
       ))}
     </>
   );