From a4a4785ca4273819f382681738a87cb5e6bc3fe0 Mon Sep 17 00:00:00 2001
From: rizky <rizky@avolut.com>
Date: Sun, 11 Aug 2024 01:01:37 -0700
Subject: [PATCH] fixing multi upload

---
 comps/form/field/Field.tsx                |  2 +-
 comps/form/field/type/TypeRichText.tsx    | 15 ++++++++++-
 comps/form/field/type/TypeUploadMulti.tsx | 31 ++++++++++++++++-------
 3 files changed, 37 insertions(+), 11 deletions(-)

diff --git a/comps/form/field/Field.tsx b/comps/form/field/Field.tsx
index 2b2c97a..b169d84 100755
--- a/comps/form/field/Field.tsx
+++ b/comps/form/field/Field.tsx
@@ -101,7 +101,7 @@ export const Field: FC<FieldProp> = (arg) => {
       )}
       ref={typeof arg.field_ref === "function" ? arg.field_ref : undefined}
     >
-      {showlabel !== "n" && <Label field={field} fm={fm} />}
+      {showlabel !== "n" && field.label && <Label field={field} fm={fm} />}
       <div className={cx("field-input c-flex c-flex-1 c-flex-col")}>
         <FieldInput
           field={field}
diff --git a/comps/form/field/type/TypeRichText.tsx b/comps/form/field/type/TypeRichText.tsx
index 5bd32ae..a6dcdd1 100755
--- a/comps/form/field/type/TypeRichText.tsx
+++ b/comps/form/field/type/TypeRichText.tsx
@@ -44,7 +44,20 @@ export const FieldRichText: FC<{
   }, []);
   let value: any = fm.data[field.name];
   return (
-    <div className="c-flex c-flex-col c-w-full">
+    <div
+      className={cx(
+        "c-flex c-flex-col c-w-full",
+        css`
+          .ql-toolbar,
+          .ql-container {
+            border: 0px !important;
+          }
+          .ql-container {
+            border-top: 1px solid #cecece !important;
+          }
+        `
+      )}
+    >
       <div
         ref={(e) => (local.ref = e)}
         className={cx(css`
diff --git a/comps/form/field/type/TypeUploadMulti.tsx b/comps/form/field/type/TypeUploadMulti.tsx
index 7f1ceb6..90f8783 100755
--- a/comps/form/field/type/TypeUploadMulti.tsx
+++ b/comps/form/field/type/TypeUploadMulti.tsx
@@ -2,14 +2,11 @@ import { useLocal } from "@/utils/use-local";
 import { Spinner } from "lib/comps/ui/field-loading";
 import { Tooltip } from "lib/comps/ui/tooltip";
 import get from "lodash.get";
-import { Check, Trash2, Upload } from "lucide-react";
+import { Star, Trash2, Upload } from "lucide-react";
 import { ChangeEvent, FC } from "react";
 import { FMLocal, FieldLocal, FieldProp } from "../../typings";
 import { ThumbPreview } from "./FilePreview";
 import { PropTypeInput } from "./TypeInput";
-const w = window as unknown as {
-  serverurl: string;
-};
 
 export const FieldUploadMulti: FC<{
   field: FieldLocal;
@@ -19,8 +16,9 @@ export const FieldUploadMulti: FC<{
   arg: FieldProp;
   on_change: (e: any) => void | Promise<void>;
 }> = ({ field, fm, prop, on_change, arg }) => {
+
   let value: string = (fm.data[field.name] || "").trim();
-  // let type_upload =
+  
   const input = useLocal({
     value: 0 as any,
     display: false as any,
@@ -133,6 +131,13 @@ export const FieldUploadMulti: FC<{
                 <div
                   className={cx(
                     "c-relative",
+                    css`
+                      &:hover {
+                        .upload-star {
+                          border: 1px solid gray;
+                        }
+                      }
+                    `,
                     fm.data[cover.field] === value &&
                       css`
                         .thumb-preview {
@@ -195,7 +200,10 @@ export const FieldUploadMulti: FC<{
                         </div>
 
                         {cover.field && (
-                          <Tooltip content={`Mark as ${cover.text}`} placement="right">
+                          <Tooltip
+                            content={`Mark as ${cover.text}`}
+                            placement="right"
+                          >
                             <div
                               onClick={(e) => {
                                 e.preventDefault();
@@ -209,17 +217,22 @@ export const FieldUploadMulti: FC<{
                                 fm.render();
                               }}
                               className={cx(
-                                "c-flex c-flex-row c-items-center c-px-1 c-rounded c-bg-white c-cursor-pointer hover:c-bg-blue-100 transition-all",
+                                "c-flex c-flex-row c-items-center c-px-1 c-rounded c-bg-white c-cursor-pointer hover:c-bg-blue-100 transition-all upload-star",
                                 css`
-                                  border: 1px solid black;
+                                  border: 1px solid transparent;
                                   width: 25px;
                                   height: 25px;
+
+                                  &:hover {
+                                    border: 1px solid #1c4ed8;
+                                    outline: 1px solid #1c4ed8;
+                                  }
                                 `
                               )}
                             >
                               {value === fm.data[cover.field] && (
                                 <>
-                                  <Check />
+                                  <Star fill="#1c4ed8" stroke="#1c4ed8" />
                                 </>
                               )}
                             </div>