feat: update logo

web/app/components/base/logo/dify-logo.tsx

@@ -19,26 +19,60 @@ export const logoSizeMap: Record<LogoSize, string> = {
   small: 'w-9 h-4',
 }
 
+const aceBadgePath = '/logo/acedatacloud-badge.svg'
+
+const aceBadgeSizeMap: Record<LogoSize, string> = {
+  large: 'w-4 h-4',
+  medium: 'w-3 h-3',
+  small: 'w-2.5 h-2.5',
+}
+
+const aceBadgePosMap: Record<LogoSize, string> = {
+  large: '-right-2 -bottom-2',
+  medium: '-right-2 -bottom-2',
+  small: '-right-2 -bottom-2',
+}
+
 type DifyLogoProps = {
   style?: LogoStyle
   size?: LogoSize
+  withAceBadge?: boolean
   className?: string
 }
 
 const DifyLogo: FC<DifyLogoProps> = ({
   style = 'default',
   size = 'medium',
+  withAceBadge = true,
   className,
 }) => {
   const { theme } = useTheme()
   const themedStyle = (theme === 'dark' && style === 'default') ? 'monochromeWhite' : style
 
   return (
-    <img
-      src={`${basePath}${logoPathMap[themedStyle]}`}
-      className={cn('block object-contain', logoSizeMap[size], className)}
-      alt="Dify logo"
-    />
+    <span className="relative inline-block align-middle">
+      <img
+        src={`${basePath}${logoPathMap[themedStyle]}`}
+        className={cn('block object-contain', logoSizeMap[size], className)}
+        alt="Dify logo"
+      />
+      {withAceBadge && (
+        <span
+          className={cn(
+            'pointer-events-none absolute flex items-center justify-center overflow-hidden rounded-full border-[0.5px] border-components-panel-border bg-background-default p-[1px]',
+            aceBadgeSizeMap[size],
+            aceBadgePosMap[size],
+          )}
+          aria-hidden="true"
+        >
+          <img
+            src={`${basePath}${aceBadgePath}`}
+            className="h-full w-full"
+            alt=""
+          />
+        </span>
+      )}
+    </span>
   )
 }