From 3a8aafdc38a41acf99e12e221011ac4041f8db32 Mon Sep 17 00:00:00 2001
From: shuai <lishuailing@sifou.com>
Date: Fri, 3 Mar 2023 16:57:33 +0800
Subject: [PATCH] fix: interface add default avatar

---
 i18n/en_US.yaml                        |  3 +++
 ui/src/common/constants.ts             | 11 +++++++++++
 ui/src/common/interface.ts             |  1 +
 ui/src/components/Avatar/index.tsx     |  4 ++++
 ui/src/pages/Admin/Interface/index.tsx | 20 +++++++++++++++++++-
 ui/src/stores/interface.ts             |  1 +
 6 files changed, 39 insertions(+), 1 deletion(-)

diff --git a/i18n/en_US.yaml b/i18n/en_US.yaml
index 69a39c12..44929c3d 100644
--- a/i18n/en_US.yaml
+++ b/i18n/en_US.yaml
@@ -1235,6 +1235,9 @@ ui:
         label: Timezone
         msg: Timezone cannot be empty.
         text: Choose a city in the same timezone as you.
+      avatar:
+        label: Default Avatar
+        text: For users without a custom avatar of their own.
     smtp:
       page_title: SMTP
       from_email:
diff --git a/ui/src/common/constants.ts b/ui/src/common/constants.ts
index 23844d4f..79c3c873 100644
--- a/ui/src/common/constants.ts
+++ b/ui/src/common/constants.ts
@@ -580,3 +580,14 @@ export const TIMELINE_NORMAL_ACTIVITY_TYPE = [
   'reopened',
   'closed',
 ];
+
+export const SYSTEM_AVATAR_OPTIONS = [
+  {
+    label: 'System',
+    value: 'system',
+  },
+  {
+    label: 'Gravatar',
+    value: 'gravatar',
+  },
+];
diff --git a/ui/src/common/interface.ts b/ui/src/common/interface.ts
index 1797813f..b14e44ca 100644
--- a/ui/src/common/interface.ts
+++ b/ui/src/common/interface.ts
@@ -297,6 +297,7 @@ export interface HelmetUpdate extends Omit<HelmetBase, 'pageTitle'> {
 export interface AdminSettingsInterface {
   language: string;
   time_zone?: string;
+  default_avatar?: string;
 }
 
 export interface AdminSettingsSmtp {
diff --git a/ui/src/components/Avatar/index.tsx b/ui/src/components/Avatar/index.tsx
index f9d5bd6f..55a449dd 100644
--- a/ui/src/components/Avatar/index.tsx
+++ b/ui/src/components/Avatar/index.tsx
@@ -3,6 +3,7 @@ import { memo, FC } from 'react';
 import classNames from 'classnames';
 
 import DefaultAvatar from '@/assets/images/default-avatar.svg';
+import { interfaceStore } from '@/stores';
 
 interface IProps {
   /** avatar url */
@@ -14,6 +15,9 @@ interface IProps {
 }
 
 const Index: FC<IProps> = ({ avatar, size, className, searchStr = '' }) => {
+  const { default_avatar } = interfaceStore((state) => state.interface);
+
+  console.log('avatar', default_avatar);
   let url = '';
   if (typeof avatar === 'string') {
     if (avatar.length > 1) {
diff --git a/ui/src/pages/Admin/Interface/index.tsx b/ui/src/pages/Admin/Interface/index.tsx
index f710b94f..13008b9a 100644
--- a/ui/src/pages/Admin/Interface/index.tsx
+++ b/ui/src/pages/Admin/Interface/index.tsx
@@ -9,7 +9,7 @@ import {
 } from '@/common/interface';
 import { interfaceStore } from '@/stores';
 import { JSONSchema, SchemaForm, UISchema } from '@/components';
-import { DEFAULT_TIMEZONE } from '@/common/constants';
+import { DEFAULT_TIMEZONE, SYSTEM_AVATAR_OPTIONS } from '@/common/constants';
 import { updateInterfaceSetting, useInterfaceSetting } from '@/services';
 import {
   setupAppLanguage,
@@ -27,6 +27,8 @@ const Interface: FC = () => {
   const [langs, setLangs] = useState<LangsType[]>();
   const { data: setting } = useInterfaceSetting();
 
+  console.log('setting', langs);
+
   const schema: JSONSchema = {
     title: t('page_title'),
     properties: {
@@ -42,6 +44,13 @@ const Interface: FC = () => {
         title: t('time_zone.label'),
         description: t('time_zone.text'),
       },
+      default_avatar: {
+        type: 'string',
+        title: t('avatar.label'),
+        description: t('avatar.text'),
+        enum: SYSTEM_AVATAR_OPTIONS?.map((v) => v.value),
+        enumNames: SYSTEM_AVATAR_OPTIONS?.map((v) => v.label),
+      },
     },
   };
 
@@ -56,6 +65,11 @@ const Interface: FC = () => {
       isInvalid: false,
       errorMsg: '',
     },
+    default_avatar: {
+      value: setting?.default_avatar || 'System',
+      isInvalid: false,
+      errorMsg: '',
+    },
   });
 
   const uiSchema: UISchema = {
@@ -65,6 +79,9 @@ const Interface: FC = () => {
     time_zone: {
       'ui:widget': 'timezone',
     },
+    default_avatar: {
+      'ui:widget': 'select',
+    },
   };
   const getLangs = async () => {
     const res: LangsType[] = await loadLanguageOptions(true);
@@ -97,6 +114,7 @@ const Interface: FC = () => {
     const reqParams: AdminSettingsInterface = {
       language: formData.language.value,
       time_zone: formData.time_zone.value,
+      default_avatar: formData.default_avatar.value,
     };
 
     updateInterfaceSetting(reqParams)
diff --git a/ui/src/stores/interface.ts b/ui/src/stores/interface.ts
index c2e21133..4e74360b 100644
--- a/ui/src/stores/interface.ts
+++ b/ui/src/stores/interface.ts
@@ -12,6 +12,7 @@ const interfaceSetting = create<InterfaceType>((set) => ({
   interface: {
     language: DEFAULT_LANG,
     time_zone: '',
+    default_avatar: 'system',
   },
   update: (params) =>
     set(() => {