diff --git a/src/locales/en-US/backends.ts b/src/locales/en-US/backends.ts index e9561221..1475b8e1 100644 --- a/src/locales/en-US/backends.ts +++ b/src/locales/en-US/backends.ts @@ -44,5 +44,5 @@ export default { 'backend.filter.source': 'Filter by source', 'backend.add.custom': 'Custom', 'backend.add.community': 'Community Repository', - 'backend.community.title': 'Community Backends' + 'backend.community.title': 'Community Backends Marketplace' }; diff --git a/src/locales/ja-JP/backends.ts b/src/locales/ja-JP/backends.ts index e9561221..1475b8e1 100644 --- a/src/locales/ja-JP/backends.ts +++ b/src/locales/ja-JP/backends.ts @@ -44,5 +44,5 @@ export default { 'backend.filter.source': 'Filter by source', 'backend.add.custom': 'Custom', 'backend.add.community': 'Community Repository', - 'backend.community.title': 'Community Backends' + 'backend.community.title': 'Community Backends Marketplace' }; diff --git a/src/locales/ru-RU/backends.ts b/src/locales/ru-RU/backends.ts index 081499f5..d4934d26 100644 --- a/src/locales/ru-RU/backends.ts +++ b/src/locales/ru-RU/backends.ts @@ -44,7 +44,7 @@ export default { 'backend.filter.source': 'Filter by source', 'backend.add.custom': 'Custom', 'backend.add.community': 'Community Repository', - 'backend.community.title': 'Community Backends' + 'backend.community.title': 'Community Backends Marketplace' }; // ========== To-Do: Translate Keys (Remove After Translation) ========== @@ -53,5 +53,5 @@ export default { // 3. 'backend.filter.source': 'Filter by source', // 4. 'backend.add.custom': 'Custom', // 5. 'backend.add.community': 'Community Repository', -// 6. 'backend.community.title': 'Community Backends' +// 6. 'backend.community.title': 'Community Backends Marketplace' // ========== End of To-Do List ========== diff --git a/src/locales/zh-CN/backends.ts b/src/locales/zh-CN/backends.ts index 46979f17..3913677f 100644 --- a/src/locales/zh-CN/backends.ts +++ b/src/locales/zh-CN/backends.ts @@ -41,5 +41,5 @@ export default { 'backend.filter.source': '按来源过滤', 'backend.add.custom': '自定义', 'backend.add.community': '社区仓库', - 'backend.community.title': '社区后端' + 'backend.community.title': '社区后端市场' }; diff --git a/src/pages/backends/community/add-community-modal.tsx b/src/pages/backends/community/add-community-modal.tsx index 3e2d3fba..73991997 100644 --- a/src/pages/backends/community/add-community-modal.tsx +++ b/src/pages/backends/community/add-community-modal.tsx @@ -83,7 +83,7 @@ const AddCommunityModal: React.FC<{ > diff --git a/src/pages/backends/community/backend-detail.tsx b/src/pages/backends/community/backend-detail.tsx index d4d3e9d6..194bfc36 100644 --- a/src/pages/backends/community/backend-detail.tsx +++ b/src/pages/backends/community/backend-detail.tsx @@ -3,7 +3,7 @@ import { BulbOutlined } from '@ant-design/icons'; import { useIntl } from '@umijs/max'; import { Button, Tag, Typography } from 'antd'; import _ from 'lodash'; -import React from 'react'; +import React, { useEffect } from 'react'; import styled from 'styled-components'; import { generateIcon } from '../components/backend-card'; @@ -62,9 +62,22 @@ const UL = styled.ul` const BackendDetail: React.FC<{ onEnable: (checked: boolean, data: any) => void; onDisable?: () => void; - currentData?: any; -}> = ({ onEnable, onDisable, currentData }) => { + data?: any; +}> = ({ onEnable, onDisable, data }) => { const intl = useIntl(); + const [currentData, setCurrentData] = React.useState(data); + + useEffect(() => { + setCurrentData(data); + }, [data]); + + const handleOnEnable = async (checked: boolean) => { + await onEnable(true, currentData); + setCurrentData({ + ...currentData, + enabled: checked + }); + }; const renderSupportedFrameworks = () => { const frameworks = currentData?.framework_index_map || {}; @@ -109,7 +122,7 @@ const BackendDetail: React.FC<{ diff --git a/src/pages/backends/community/commnity-backends.tsx b/src/pages/backends/community/commnity-backends.tsx index fbc46e5d..61e78f38 100644 --- a/src/pages/backends/community/commnity-backends.tsx +++ b/src/pages/backends/community/commnity-backends.tsx @@ -3,7 +3,7 @@ import ThemeTag from '@/components/tags-wrapper/theme-tag'; import useTableFetch from '@/hooks/use-table-fetch'; import { SearchOutlined } from '@ant-design/icons'; import { useIntl } from '@umijs/max'; -import { Input, Switch, Tooltip } from 'antd'; +import { Input, Tooltip } from 'antd'; import _ from 'lodash'; import React, { useEffect } from 'react'; import styled from 'styled-components'; @@ -68,17 +68,10 @@ const CommunityBackends: React.FC<{ } > <> - {data.enabled ? ( + {data.enabled && ( {intl.formatMessage({ id: 'common.status.enabled' })} - ) : ( - e.stopPropagation()}> - handleOnEnable(checked, data)} - size="small" - > - )} diff --git a/src/pages/backends/components/backend-card.tsx b/src/pages/backends/components/backend-card.tsx index 9326b39f..f52bceaf 100644 --- a/src/pages/backends/components/backend-card.tsx +++ b/src/pages/backends/components/backend-card.tsx @@ -49,13 +49,14 @@ const SourceWrapper = styled.div` } `; -const TagInner = styled(Tag)` +// add height props +const TagInner = styled(Tag)<{ height?: number }>` display: flex; align-items: center; justify-content: center; font-size: 18px; - height: 28px; - width: 28px; + height: ${({ height }) => (height ? `${height}px` : '28px')}; + width: ${({ height }) => (height ? `${height}px` : '28px')}; border-radius: 6px; font-weight: 400; `; @@ -146,18 +147,21 @@ interface BackendCardProps { active?: boolean; } -export const generateIcon = (data: ListItem, height = 20) => { +export const generateIcon = (data: ListItem, height?: number) => { + const innHeight = height || 20; if (builtInBackendLogos[data.backend_name]) { - return ; + return ( + + ); } if (data.icon) { - return ; + return ; } const color = customColors[data.id % customColors.length]; const icon = customIcons[data.id % customIcons.length]; return ( - + {icon} ); @@ -387,7 +391,11 @@ const BackendCard: React.FC = ({ > - {data.backend_name} + + {data.backend_source === BackendSourceValueMap.CUSTOM + ? data.backend_name.replace(/-custom$/g, '') + : data.backend_name} + {renderSource()} {/*