feat: implement custom branding

frontend/web/src/components/Logo.tsx

@@ -0,0 +1,23 @@
+import classNames from "classnames";
+import { useWorkspaceStore } from "@/stores";
+import Icon from "./Icon";
+
+interface Props {
+  className?: string;
+}
+
+const Logo = ({ className }: Props) => {
+  const workspaceStore = useWorkspaceStore();
+  const branding = workspaceStore.setting.branding ? new TextDecoder().decode(workspaceStore.setting.branding) : "";
+  return (
+    <div className={classNames("w-8 h-auto dark:text-gray-500 rounded-lg overflow-hidden", className)}>
+      {branding ? (
+        <img src={branding} alt="branding" className="max-w-full max-h-full" />
+      ) : (
+        <Icon.CircleSlash className="w-full h-auto" strokeWidth={1.5} />
+      )}
+    </div>
+  );
+};
+
+export default Logo;