style: update skelaton

src/module/discussion/ui/form_create_discussion.tsx

@@ -5,34 +5,32 @@ import { Avatar, Box, Button, Center, Grid, Group, Text, Textarea } from "@manti
 import { useState } from "react";
 import toast from "react-hot-toast";
 import { funCreateDiscussion } from "../lib/api_discussion";
+import { useParams, useRouter } from "next/navigation";
 
-export default function FormCreateDiscussion({id}: {id: string}) {
+export default function FormCreateDiscussion({ id }: { id: string }) {
    const [isValModal, setValModal] = useState(false)
+   const router = useRouter()
+   const param = useParams<{ id: string }>()
    const [isData, setData] = useState({
       desc: "",
       idDivision: id
    })
 
-
-   function onTrue(val: boolean) {
-      if (val) {
-         toast.success("Sukses! Data tersimpan");
-      }
-      setValModal(false)
-   }
-
    async function createDiscussion(val: boolean) {
       try {
-         const response = await funCreateDiscussion({
-            desc: isData.desc,
-            idDivision: id
-         })
-
-         if (response.success) {
-            toast.success(response.message)
-            onTrue(true)
-         } else {
-            toast.error(response.message)
+         if (val) {
+            const response = await funCreateDiscussion({
+               desc: isData.desc,
+               idDivision: id
+            })
+   
+            if (response.success) {
+               toast.success(response.message)
+               router.push(`/division/${response.data.id}/discussion/`)
+               setValModal(false)
+            } else {
+               toast.error(response.message)
+            }
          }
       } catch (error) {
          console.log(error);
@@ -45,36 +43,41 @@ export default function FormCreateDiscussion({id}: {id: string}) {
 
 
    return (
-      <Box>
-         <Box p={20}>
-            <Group>
-               <Avatar src={'https://i.pravatar.cc/1000?img=32'} alt="it's me" size="lg" />
-               <Box>
-                  <Textarea
-                     placeholder="Tuliskan apa yang ingin anda diskusikan"
-                     w={"100%"}
-                     styles={{
-                        input: {
-                           border: 'none',
-                           backgroundColor: 'transparent',
-                        }
-                     }}
-                     onChange={(e) => setData({ ...isData, desc: e.target.value })}
-                  />
-               </Box>
-            </Group>
-            <Box mt="xl">
-               <Button
-                  color="white"
-                  bg={WARNA.biruTua}
-                  size="lg"
-                  radius={30}
-                  fullWidth
-                  onClick={() => setValModal(true)}
-               >
-                  Simpan
-               </Button>
-            </Box>
+      <Box pos={"relative"} h={"89vh"}>
+         <Box p={20} >
+            <Grid gutter={0} pt={10}>
+               <Grid.Col span={"auto"}>
+                  <Avatar src={'https://i.pravatar.cc/1000?img=32'} alt="it's me" size="lg" />
+               </Grid.Col>
+               <Grid.Col span={10}>
+                  <Box>
+                     <Textarea
+                        placeholder="Tuliskan apa yang ingin anda diskusikan"
+                        styles={{
+                           input: {
+                              border: 'none',
+                              backgroundColor: 'transparent',
+                              height: "60vh"
+                           }
+                        }}
+                        value={isData.desc}
+                        onChange={(e) => setData({ ...isData, desc: e.target.value })}
+                     />
+                  </Box>
+               </Grid.Col>
+            </Grid>
+         <Box pos={"absolute"} bottom={10} left={0} right={0} p={20}>
+            <Button
+               color="white"
+               bg={WARNA.biruTua}
+               size="lg"
+               radius={30}
+               fullWidth
+               onClick={() => setValModal(true)}
+            >
+               Simpan
+            </Button>
+         </Box>
          </Box>
 
          <LayoutModal opened={isValModal} onClose={() => setValModal(false)}