fix: interface add default avatar

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:

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',
+  },
+];

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 {

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) {

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)

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(() => {