Fix : Avatar

Deskripsi:
- Ubah avatar yang image nya di ambil dari storage wibu server
- Avatar forum
- Avatra job
- Avatar Investasi
- Avatar donasi
## No Issuee

src/app_modules/forum/forumku/forum_profile.tsx

@@ -1,12 +1,24 @@
 "use client";
 
+import { pathAssetImage } from "@/app/lib";
+import { RouterImagePreview } from "@/app/lib/router_hipmi/router_image_preview";
 import { RouterProfile } from "@/app/lib/router_hipmi/router_katalog";
 import {
   AccentColor,
   MainColor,
 } from "@/app_modules/_global/color/color_pallet";
+import { ComponentGlobal_LoaderAvatar } from "@/app_modules/_global/component";
 import { MODEL_USER } from "@/app_modules/home/model/interface";
-import { Avatar, Button, Center, Grid, Stack, Text } from "@mantine/core";
+import {
+  Avatar,
+  Box,
+  Button,
+  Center,
+  Grid,
+  Image,
+  Stack,
+  Text,
+} from "@mantine/core";
 import { IconCircleFilled } from "@tabler/icons-react";
 import { useRouter } from "next/navigation";
 
@@ -21,25 +33,54 @@ export default function ComponentForum_ViewForumProfile({
 }) {
   const router = useRouter();
   const [loading, setLoading] = useState(false);
+  const [isLoadingImage, setIsLoadingImage] = useState(false);
 
   return (
     <>
       <Center>
-        <Avatar
-          bg={"gray"}
-          radius={"100%"}
-          sx={{
-            borderStyle: "solid",
-            borderWidth: "0.5px",
-            borderColor: AccentColor.yellow,
+        <Box
+          h={100}
+          style={{ borderRadius: "50%" }}
+          onClick={() => {
+            router.push(
+              RouterImagePreview.main({
+                id: auhtorSelectedData.Profile.imageId as any,
+              }),
+              { scroll: false }
+            );
+            setIsLoadingImage(true);
           }}
-          size={100}
-          alt="foto"
-          src={
-            RouterProfile.api_foto_profile +
-            auhtorSelectedData?.Profile?.imagesId
-          }
-        />
+        >
+          {isLoadingImage ? (
+            <Avatar
+              size={100}
+              radius={"100%"}
+              style={{
+                borderColor: "white",
+                borderStyle: "solid",
+                borderWidth: "1px",
+              }}
+              opacity={0.7}
+            >
+              <ComponentGlobal_LoaderAvatar
+                sizeAvatar={100}
+                fileId={auhtorSelectedData.Profile.imageId as any}
+              />
+              <Image
+                pos={"absolute"}
+                height={50}
+                width={50}
+                alt="Photo"
+                src={pathAssetImage.new_loader}
+              />
+            </Avatar>
+          ) : (
+            <ComponentGlobal_LoaderAvatar
+              sizeAvatar={100}
+              fileId={auhtorSelectedData.Profile.imageId as any}
+            />
+          )}
+        </Box>
       </Center>
       <Grid>
         <Grid.Col span={"auto"}>
@@ -69,7 +110,7 @@ export default function ComponentForum_ViewForumProfile({
                 border: `1px solid ${AccentColor.yellow}`,
                 backgroundColor: MainColor.yellow,
               }}
-              c="white"
+              c="black"
               loaderPosition="center"
               loading={loading ? true : false}
               radius={"xl"}

src/app_modules/forum/forumku/index.tsx

@@ -2,8 +2,7 @@
 
 import { RouterForum } from "@/app/lib/router_hipmi/router_forum";
 import {
-  AccentColor,
-  MainColor,
+  AccentColor
 } from "@/app_modules/_global/color/color_pallet";
 import { MODEL_USER } from "@/app_modules/home/model/interface";
 import {
@@ -25,6 +24,7 @@ import ComponentForum_ForumkuMainCardView from "../component/forumku_component/f
 import { forum_getAllPostingByAuhtorId } from "../fun/get/get_list_posting_by_author_id";
 import { MODEL_FORUM_POSTING } from "../model/interface";
 import ComponentForum_ViewForumProfile from "./forum_profile";
+import ComponentGlobal_CreateButton from "@/app_modules/_global/component/button_create";
 
 export default function Forum_Forumku({
   auhtorSelectedData,
@@ -46,32 +46,8 @@ export default function Forum_Forumku({
 
   return (
     <>
-      {userLoginId === auhtorSelectedData.id ? (
-        <Affix position={{ bottom: rem(100), right: rem(30) }}>
-          <ActionIcon
-            opacity={scroll.y > 0 ? 0.5 : ""}
-            style={{
-              transition: "0.5s",
-              border: `1px solid ${AccentColor.skyblue}`,
-            }}
-            size={"xl"}
-            radius={"xl"}
-            variant="transparent"
-            bg={AccentColor.blue}
-            onClick={() => {
-              setLoadingCreate(true);
-              router.push(RouterForum.create);
-            }}
-          >
-            {loadingCreate ? (
-              <Loader size={25} />
-            ) : (
-              <IconPencilPlus color="white" />
-            )}
-          </ActionIcon>
-        </Affix>
-      ) : (
-        ""
+      {userLoginId === auhtorSelectedData.id && (
+        <ComponentGlobal_CreateButton path={RouterForum.create} />
       )}
 
       <Stack spacing={"xl"}>
@@ -92,7 +68,7 @@ export default function Forum_Forumku({
         ) : (
           // --- Main component --- //
           <ScrollOnly
-            height={data.length < 5 ? "60vh" : "100vh"}
+            height={data.length < 5 ? "75vh" : "100vh"}
             renderLoading={() => (
               <Center mt={"lg"}>
                 <Loader color={"yellow"} />

src/app_modules/forum/forumku/layout.tsx

@@ -1,13 +1,9 @@
 "use client";
 
-import { AppShell } from "@mantine/core";
-import React from "react";
-import ComponentForum_HeaderTamplate from "../component/header/header_tamplate";
-import { MODEL_USER } from "@/app_modules/home/model/interface";
-import { IconX } from "@tabler/icons-react";
-import AppComponentGlobal_LayoutTamplate from "@/app_modules/_global/component_layout_tamplate";
-import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
 import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
+import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
+import { IconX } from "@tabler/icons-react";
+import React from "react";
 
 export default function LayoutForum_Forumku({
   children,
@@ -20,25 +16,11 @@ export default function LayoutForum_Forumku({
     <>
       <UIGlobal_LayoutTamplate
         header={
-          <UIGlobal_LayoutHeaderTamplate
-            title={`${username}`}
-            iconLeft={<IconX />}
-          />
+          <UIGlobal_LayoutHeaderTamplate title={"Forum"} iconLeft={<IconX />} />
         }
       >
         {children}
       </UIGlobal_LayoutTamplate>
-
-      {/* <AppComponentGlobal_LayoutTamplate
-        header={
-          <ComponentForum_HeaderTamplate
-            title={`${username}`}
-            changeIconBack={<IconX />}
-          />
-        }
-      >
-        {children}
-      </AppComponentGlobal_LayoutTamplate> */}
     </>
   );
 }