@giteeteam/apps-team-components 1.11.16 → 1.11.18-alpha.1

package/dist/components/common/user-field/UserAvatar.d.ts

@@ -5,6 +5,7 @@ interface UserAvatarProps {
         avatar?: {
             url?: string;
         };
+        bosKey?: string;
         username?: string;
         name?: string;
         nickname?: string;

package/dist/components/common/user-field/UserAvatar.js

@@ -1,15 +1,38 @@
 import { jsx } from '@emotion/react/jsx-runtime';
-import React__default, { useMemo } from 'react';
+import React__default, { useState, useMemo, useEffect } from 'react';
 import { ClassNames } from '@emotion/react';
+import useCurrentWorkspace from '../../../lib/hooks/useCurrentWorkspace.js';
 import { getNameBadge, getBackgroundColor } from '../utils.js';
 import { avatarItemStyle, avatarStyle, defaultAvatarStyle } from './style/index.js';
 
+const imgInAvatarStyle = `
+  display: block;
+  width: 100%;
+  height: 100%;
+  object-fit: contain;
+  border-radius: 50%;
+`;
 const UserAvatar = React__default.memo(({ user, className }) => {
-    const avatarUrl = useMemo(() => { var _a; return (_a = user === null || user === void 0 ? void 0 : user.avatar) === null || _a === void 0 ? void 0 : _a.url; }, [user]);
+    const { workspaceKey } = useCurrentWorkspace();
+    const [imageLoadFailed, setImageLoadFailed] = useState(false);
+    const avatarUrl = useMemo(() => {
+        var _a, _b, _c, _d;
+        const url = (_a = user === null || user === void 0 ? void 0 : user.avatar) === null || _a === void 0 ? void 0 : _a.url;
+        if (url)
+            return url;
+        const bosKey = (_d = (_c = (_b = user === null || user === void 0 ? void 0 : user.bosKey) === null || _b === void 0 ? void 0 : _b.trim) === null || _c === void 0 ? void 0 : _c.call(_b)) !== null && _d !== void 0 ? _d : user === null || user === void 0 ? void 0 : user.bosKey;
+        if (!workspaceKey || !bosKey)
+            return undefined;
+        return `/api/one/${workspaceKey}/rest/v1/companies/${workspaceKey}/users/logo/picture?url=${encodeURIComponent(bosKey)}`;
+    }, [user, workspaceKey]);
+    useEffect(() => {
+        setImageLoadFailed(false);
+    }, [avatarUrl]);
     const displayName = useMemo(() => (user === null || user === void 0 ? void 0 : user.name) || (user === null || user === void 0 ? void 0 : user.nickname) || (user === null || user === void 0 ? void 0 : user.username), [user]);
     const userBadge = useMemo(() => getNameBadge(displayName), [displayName]);
+    const showImage = Boolean(avatarUrl) && !imageLoadFailed;
     return (jsx(ClassNames, { children: ({ cx, css }) => {
-            return avatarUrl ? (jsx("span", { className: cx('avatar-item', css(avatarItemStyle), css(avatarStyle), css(className)), style: { backgroundImage: `url(${avatarUrl})` } })) : (jsx("span", { className: cx('avatar-item', css(avatarItemStyle), css(defaultAvatarStyle), css(className)), style: getBackgroundColor(userBadge), children: userBadge }));
+            return showImage ? (jsx("span", { className: cx('avatar-item', css(avatarItemStyle), css(avatarStyle), css(className)), style: { overflow: 'hidden' }, children: jsx("img", { src: avatarUrl, alt: "", decoding: "async", className: cx(css(imgInAvatarStyle)), onError: () => setImageLoadFailed(true) }) })) : (jsx("span", { className: cx('avatar-item', css(avatarItemStyle), css(defaultAvatarStyle), css(className)), style: getBackgroundColor(userBadge), children: userBadge }));
         } }));
 });
 UserAvatar.displayName = 'UserAvatar';

package/dist/components/fields/dropdown/BaseField.js

@@ -21,6 +21,7 @@ import { getRealValueByIqlTo } from '../../filters/filter-search/utils.js';
 import { REMOTE_DATA_QUOTE_FIELD_TYPE } from '../../../lib/constants/field.js';
 import { BASE_FIELD_WIDTH, FIELD_CONTAINERS_PAGE, CURRENT_WORKSPACE, FIELD_TYPE_KEY_MAPPINGS } from '../../../lib/global.js';
 import useAntdConfig from '../../../lib/hooks/useAntdConfig.js';
+import { useDropdownOptionsFetching } from '../../../lib/hooks/useFetchDropdownOptionsStore.js';
 import useI18n from '../../../lib/hooks/useI18n.js';
 import { dropDownOptionsState, createDropDownOptionsStoreKey } from '../../../lib/store/dropDownOptionsStore.js';
 import { API_KEY } from '../../../lib/swr/constants.js';
@@ -95,6 +96,7 @@ const Dropdown = props => {
     }, [dataQuoteInit, options, propsValue, userData === null || userData === void 0 ? void 0 : userData.display, value]);
     const dropDownOptionsMap = useAtomValue(dropDownOptionsState);
     const storeOptions = dropDownOptionsMap[createDropDownOptionsStoreKey(objectId)];
+    const isDropdownOptionsFetching = useDropdownOptionsFetching();
     const _options = useMemo(() => ((options === null || options === void 0 ? void 0 : options.length) > 0 ? options : finallyOptions) || [], [finallyOptions, options]);
     async function fetcher() {
         return await fetchOptions('');
@@ -193,6 +195,7 @@ const Dropdown = props => {
         var _a;
         loggers('loadMoreRef', loadMoreRef.current);
         if (canAsyncFetchOption &&
+            !isDropdownOptionsFetching &&
             Array.isArray(value) &&
             optionLoadedRef.current === true &&
             loadMoreRef.current === false &&
@@ -215,11 +218,12 @@ const Dropdown = props => {
                     const options = cacheSelectOptions(typeof dataQuoteInit === 'function'
                         ? dataQuoteInit(appendOptions, value, userData === null || userData === void 0 ? void 0 : userData.display)
                         : appendOptions);
-                    setOptions(options);
+                    const mergedOptions = mergeStoreOptions(options, storeOptions);
+                    setOptions(mergedOptions);
                     setLoading(false);
                     const res = valueRef.current.filter(val => {
                         const value = typeof val === 'object' ? val.value : val;
-                        const index = options === null || options === void 0 ? void 0 : options.findIndex((o) => {
+                        const index = mergedOptions === null || mergedOptions === void 0 ? void 0 : mergedOptions.findIndex((o) => {
                             return o.value === value;
                         });
                         if (index !== -1 || value === 'NULL' || value === CURRENT_WORKSPACE) {
@@ -273,6 +277,8 @@ const Dropdown = props => {
         cachedOptionsRef,
         setLoading,
         setOptions,
+        storeOptions,
+        isDropdownOptionsFetching,
     ]);
     useEffect(() => {
         onOptionsChange && onOptionsChange(options);

package/dist/index.d.ts

@@ -48,4 +48,4 @@ export { TableCell } from './components/table-components';
 export { getAllReadComponents, getStandardEditComponents, getStandardReadComponents, } from './components/table-components/utils';
 export { LibraryProvider } from './lib/contexts';
 export { useDataQuoteStore } from './lib/hooks/useDataQuoteStore';
-export { useFetchDropdownOptionsStore } from './lib/hooks/useFetchDropdownOptionsStore';
+export { useDropdownOptionsFetching, useFetchDropdownOptionsStore } from './lib/hooks/useFetchDropdownOptionsStore';

package/dist/index.js

@@ -48,4 +48,4 @@ export { TableCell } from './components/table-components/index.js';
 export { getAllReadComponents, getStandardEditComponents, getStandardReadComponents } from './components/table-components/utils.js';
 export { LibraryProvider } from './lib/contexts/index.js';
 export { useDataQuoteStore } from './lib/hooks/useDataQuoteStore.js';
-export { useFetchDropdownOptionsStore } from './lib/hooks/useFetchDropdownOptionsStore.js';
+export { useDropdownOptionsFetching, useFetchDropdownOptionsStore } from './lib/hooks/useFetchDropdownOptionsStore.js';

package/dist/lib/hooks/useFetchDropdownOptionsStore.d.ts

@@ -8,5 +8,6 @@ interface DataSourceItem {
     values?: Record<string, any>;
     [key: string]: any;
 }
+export declare const useDropdownOptionsFetching: () => boolean;
 export declare const useFetchDropdownOptionsStore: (dataSource?: DataSourceItem[], customFields?: CustomField[], workspaceId?: string) => void;
 export {};

package/dist/lib/hooks/useFetchDropdownOptionsStore.js

@@ -1,8 +1,8 @@
-import { useRef, useMemo, useEffect } from 'react';
-import { useSetAtom } from 'jotai';
+import { useRef, useCallback, useMemo, useEffect } from 'react';
+import { useAtomValue, useSetAtom } from 'jotai';
 import useFetch from '../fetch.js';
 import { FIELD_TYPE_KEY_MAPPINGS } from '../global.js';
-import { dropDownOptionsState, createDropDownOptionsStoreKey } from '../store/dropDownOptionsStore.js';
+import { dropDownOptionsFetchingState, dropDownOptionsState, createDropDownOptionsStoreKey } from '../store/dropDownOptionsStore.js';
 
 const mergeDropDownOptions = (currentOptions, newOptions) => {
     const seen = new Map();
@@ -20,12 +20,21 @@ const mergeDropDownOptions = (currentOptions, newOptions) => {
 const getRequestCacheKey = (storeKey, workspaceId) => {
     return `${workspaceId || 'default'}:${storeKey}`;
 };
+const useDropdownOptionsFetching = () => {
+    return useAtomValue(dropDownOptionsFetchingState);
+};
 const useFetchDropdownOptionsStore = (dataSource, customFields, workspaceId) => {
     const fetch = useFetch();
     const setDropDownOptionsMap = useSetAtom(dropDownOptionsState);
+    const setFetching = useSetAtom(dropDownOptionsFetchingState);
+    const activeRequestCountRef = useRef(0);
     const fetchedValuesRef = useRef({});
     const pendingRequestRef = useRef({});
     const prevWorkspaceIdRef = useRef(workspaceId);
+    const updateFetchingState = useCallback((delta) => {
+        activeRequestCountRef.current += delta;
+        setFetching(activeRequestCountRef.current > 0);
+    }, [setFetching]);
     const dropdownFields = useMemo(() => {
         if (!(customFields === null || customFields === void 0 ? void 0 : customFields.length))
             return [];
@@ -39,7 +48,6 @@ const useFetchDropdownOptionsStore = (dataSource, customFields, workspaceId) =>
         }
         if (!dropdownFields.length || !(dataSource === null || dataSource === void 0 ? void 0 : dataSource.length))
             return;
-        let cancelled = false;
         const fetchFieldOptions = async (field) => {
             var _a;
             const storeKey = createDropDownOptionsStoreKey(field.objectId);
@@ -68,13 +76,12 @@ const useFetchDropdownOptionsStore = (dataSource, customFields, workspaceId) =>
                 return;
             }
             pendingRequestRef.current[requestCacheKey] = requestSignature;
+            updateFetchingState(1);
             try {
                 const { data } = await fetch.get(`/dropdown/data/${field.objectId}`, {
                     params: { propsValue: JSON.stringify(missingValues), workspaceId },
                 });
                 const options = (data === null || data === void 0 ? void 0 : data.data) || [];
-                if (cancelled)
-                    return;
                 missingValues.forEach(v => fetchedValues.add(v));
                 if (!options.length)
                     return;
@@ -94,16 +101,14 @@ const useFetchDropdownOptionsStore = (dataSource, customFields, workspaceId) =>
                 console.error('fetchDropdownData_error', e);
             }
             finally {
+                updateFetchingState(-1);
                 if (pendingRequestRef.current[requestCacheKey] === requestSignature) {
                     delete pendingRequestRef.current[requestCacheKey];
                 }
             }
         };
         Promise.allSettled(dropdownFields.map(field => fetchFieldOptions(field)));
-        return () => {
-            cancelled = true;
-        };
-    }, [dropdownFields, dataSource, fetch, setDropDownOptionsMap, workspaceId]);
+    }, [dropdownFields, dataSource, fetch, setDropDownOptionsMap, workspaceId, updateFetchingState]);
 };
 
-export { useFetchDropdownOptionsStore };
+export { useDropdownOptionsFetching, useFetchDropdownOptionsStore };

package/dist/lib/store/dropDownOptionsStore.d.ts

@@ -15,4 +15,7 @@ export interface DropDownOptionItem {
 export declare const dropDownOptionsState: import("jotai").PrimitiveAtom<Record<string, DropDownOptionItem[]>> & {
     init: Record<string, DropDownOptionItem[]>;
 };
+export declare const dropDownOptionsFetchingState: import("jotai").PrimitiveAtom<boolean> & {
+    init: boolean;
+};
 export declare const createDropDownOptionsStoreKey: (fieldId?: string) => string;

package/dist/lib/store/dropDownOptionsStore.js

@@ -1,8 +1,9 @@
 import { atom } from 'jotai';
 
 const dropDownOptionsState = atom({});
+const dropDownOptionsFetchingState = atom(false);
 const createDropDownOptionsStoreKey = (fieldId) => {
     return fieldId || '';
 };
 
-export { createDropDownOptionsStoreKey, dropDownOptionsState };
+export { createDropDownOptionsStoreKey, dropDownOptionsFetchingState, dropDownOptionsState };

package/dist/lib/useUser.d.ts

@@ -13,5 +13,6 @@ export type UserValueOption = {
     deleted: boolean;
     enabled: boolean;
     email?: string;
+    bosKey?: string | null;
 };
 export declare const userDataFormat: (user: UserValue) => UserValueOption;

package/dist/lib/useUser.js

@@ -22,7 +22,7 @@ const generateUserDisplayName = (user, onlyNickname = false) => {
     return (user === null || user === void 0 ? void 0 : user.nickname) ? `${user === null || user === void 0 ? void 0 : user.nickname}${displaySuffix}` : user === null || user === void 0 ? void 0 : user.username;
 };
 const userDataFormat = (user) => {
-    var _a;
+    var _a, _b;
     return ({
         label: generateUserDisplayName(user),
         value: (_a = user.objectId) !== null && _a !== void 0 ? _a : user.value,
@@ -31,6 +31,7 @@ const userDataFormat = (user) => {
         deleted: user.deleted,
         enabled: user.enabled,
         email: user.email,
+        bosKey: (_b = user.bosKey) !== null && _b !== void 0 ? _b : null,
     });
 };
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@giteeteam/apps-team-components",
-  "version": "1.11.16",
+  "version": "1.11.18-alpha.1",
   "description": "Gitee team components",
   "main": "./dist/index.js",
   "module": "./dist/index.js",