merged main into beta

src/assets/styles/components/_chart.css

@@ -0,0 +1 @@
+.apexcharts-canvas { margin-left: 0 !important; margin-right: 0 !important; }

src/assets/styles/components/index.css

@@ -1,4 +1,5 @@
 @import "./_alert.css";
+@import "./_chart.css";
 @import "./_avatar.css";
 @import "./_badge.css";
 @import "./_button.css";

src/components/collabberry/custom-components/CustomRainbowKit/UserDisconnect.tsx

@@ -0,0 +1,28 @@
+import Button from "@/components/ui/Button";
+import useAuth from "@/utils/hooks/useAuth";
+import { useAccount } from "wagmi";
+
+export const DisconnectButton = () => {
+    const { signOut } = useAuth();
+    const { isConnected } = useAccount();
+
+
+    if (!isConnected) {
+        return null;
+    }
+
+    const handleDisconnect = async () => {
+        try {
+            await signOut();
+        } catch (error) {
+            console.error("Error disconnecting:", error);
+        }
+    };
+
+    return (
+        <Button variant="transparent" size="sm" onClick={handleDisconnect}
+       >
+            Disconnect Wallet
+        </Button >
+    );
+};

src/components/collabberry/custom-components/MessageSquare.tsx

@@ -0,0 +1,29 @@
+import React from 'react';
+
+interface MessageSquareProps extends React.SVGProps<SVGSVGElement> {
+  size?: number | string;
+  className?: string;
+}
+const MessageSquare: React.FC<MessageSquareProps> = ({
+  size = 24,
+  className = "w-6 h-6",
+  ...props
+}) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    width={size}
+    height={size}
+    viewBox="0 0 24 24"
+    fill="none"
+    stroke="currentColor"
+    strokeWidth="2"
+    strokeLinecap="round"
+    strokeLinejoin="round"
+    className={`stroke-current ${className}`}
+    {...props}
+  >
+    <path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z" />
+  </svg>
+);
+
+export default MessageSquare;

src/components/layouts/AuthLayout/AuthLayout.tsx

@@ -7,6 +7,15 @@ import { LAYOUT_TYPE_BLANK } from "@/constants/theme.constant";
 import Header from "@/components/template/Header";
 import CollabberyLogoFull from "@/assets/svg/CollabberryLogoFull";
 import { SvgIcon } from "@/components/shared";
+import { DisconnectButton } from "@/components/collabberry/custom-components/CustomRainbowKit/UserDisconnect";
+
+const AuthHeaderActionEnd = () => {
+  return (
+    <>
+      <DisconnectButton />
+    </>
+  );
+};
 
 const AuthLayout = () => {
   const layoutType = useAppSelector((state) => state.theme.layout.type);
@@ -16,6 +25,7 @@ const AuthLayout = () => {
       <Header
         className="bg-transparent backdrop-blur-md shadow-none"
         headerStart={<CollabberyLogoFull  />}
+        headerEnd={<AuthHeaderActionEnd />}
       />
       <div className="container mx-auto flex flex-1 items-center flex-col justify-center">
         <View />

src/components/layouts/ModernLayout.tsx

@@ -20,7 +20,6 @@ const HeaderActionsStart = () => {
 const HeaderActionsEnd = () => {
   return (
     <>
-
       <UserAccount />
     </>
   );

src/components/ui/Button/Button.tsx

@@ -11,7 +11,7 @@ import type { ReactNode, ComponentPropsWithRef, MouseEvent } from 'react'
 
 export interface ButtonProps
     extends CommonProps,
-        Omit<ComponentPropsWithRef<'button'>, 'onClick'> {
+    Omit<ComponentPropsWithRef<'button'>, 'onClick'> {
     active?: boolean
     block?: boolean
     color?: string
@@ -21,7 +21,7 @@ export interface ButtonProps
     onClick?: (e: MouseEvent<HTMLButtonElement>) => void
     shape?: TypeAttributes.Shape
     size?: TypeAttributes.Size
-    variant?: 'solid' | 'twoTone' | 'plain' | 'default'
+    variant?: 'solid' | 'twoTone' | 'plain' | 'default' | 'transparent'
 }
 
 type ButtonColor = {
@@ -155,15 +155,30 @@ const Button = forwardRef<HTMLButtonElement, ButtonProps>((props, ref) => {
         return getBtnColor(btn)
     }
 
+    const transparentColor = () => {
+        const btn = {
+            bgColor: active
+                ? `bg-gray-200 dark:bg-gray-700`
+                : "bg-transparent border border-transparent",
+
+            textColor: `text-gray-300 dark:text-gray-100`,
+            hoverColor: active
+                ? ""
+                : `hover:bg-gray-100/20 dark:hover:bg-gray-700/20`,
+
+            activeColor: `active:bg-gray-100/40 dark:active:bg-gray-700/40`,
+        }; return getBtnColor(btn);
+    };
+
+
     const getBtnColor = ({
         bgColor,
         hoverColor,
         activeColor,
         textColor,
     }: ButtonColor) => {
-        return `${bgColor} ${
-            disabled || loading ? disabledClass : hoverColor + ' ' + activeColor
-        } ${textColor}`
+        return `${bgColor} ${disabled || loading ? disabledClass : hoverColor + ' ' + activeColor
+            } ${textColor}`
     }
 
     const btnColor = () => {
@@ -174,6 +189,8 @@ const Button = forwardRef<HTMLButtonElement, ButtonProps>((props, ref) => {
                 return twoToneColor()
             case 'plain':
                 return plainColor()
+            case 'transparent':
+                return transparentColor()
             case 'default':
                 return defaultColor()
             default:

src/configs/navigation.config/index.ts

@@ -25,6 +25,26 @@ const navigationConfig: NavigationTree[] = [
         authority: [],
         subMenu: [],
       },
+      // {
+      //   key: "admin.assistant",
+      //   path: "/assistant",
+      //   title: "Agreement Assistant",
+      //   translateKey: "nav.admin.assistant",
+      //   icon: "home",
+      //   type: NAV_ITEM_TYPE_ITEM,
+      //   authority: [],
+      //   subMenu: [],
+      // },
+      // {
+      //   key: "admin.assistant",
+      //   path: "/assistant",
+      //   title: "Agreement Assistant",
+      //   translateKey: "nav.admin.assistant",
+      //   icon: "home",
+      //   type: NAV_ITEM_TYPE_ITEM,
+      //   authority: [],
+      //   subMenu: [],
+      // },
       {
         key: "admin.assessment",
         path: "/assessment",

src/configs/routes.config/routes.config.ts

@@ -34,6 +34,12 @@ export const protectedRoutes = [
     component: lazy(() => import("@/views/main/Scores/Scores")),
     authority: [],
   },
+  // {
+  //   key: "admin.assistant",
+  //   path: "/assistant",
+  //   component: lazy(() => import("@/views/main/AgreementAssistant/AgreementAssistant")),
+  //   authority: [],
+  // },
   {
     key: "admin.my-scores",
     path: "/scores/my-scores",

src/constants/chart.constant.ts

@@ -37,3 +37,26 @@ export const COLORS_LIGHT = [
     COLOR_6_LIGHT,
     COLOR_7_LIGHT,
 ]
+
+export const CUSTOM_COLORS = [
+    "#6B7AC7", // Blue Yonder
+    "#B14D57", // Rose Taupe
+    "#4A90E2", // Dodger Blue
+    "#50C878", // Emerald
+    "#FFA726", // Carrot Orange
+    "#FDD835", // Dandelion
+    "#EC407A", // Cerise
+    "#9575CD", // Amethyst
+    "#26A69A", // Teal
+    "#FF7043", // Coral
+    "#BA68C8", // Wisteria
+    "#283593", // Dark Blue
+    "#4DD0E1", // Turquoise
+    "#AEEA00", // Lime
+    "#D81B60", // Raspberry
+    "#00ACC1", // Cyan
+    "#FFD54F", // Maize
+    "#5E35B1", // Violet
+    "#9E9D24", // Olive
+    "#90A4AE", // Slate Gray
+    ]