chore(merge): Merge feature branch and fix conflicts

oceanbase · Oct 8, 2024 · e0ba5b1 · e0ba5b1
2 parents d764372 + 93c4f6f
commit e0ba5b1
Show file tree

Hide file tree

Showing 661 changed files with 13,937 additions and 16,118 deletions.
diff --git a/.dumi/theme/builtins/IconSearch/fields.ts b/.dumi/theme/builtins/IconSearch/fields.ts
@@ -5,69 +5,13 @@ const all = Object.keys(ObIcons)
   .filter((n, i, arr) => arr.indexOf(n) === i);
 
 const direction = [
-  'StepBackward',
-  'StepForward',
-  'FastBackward',
-  'FastForward',
-  'Shrink',
-  'ArrowsAlt',
-  'Down',
-  'Up',
-  'Left',
-  'Right',
-  'CaretUp',
-  'CaretDown',
-  'CaretLeft',
-  'CaretRight',
-  'UpCircle',
-  'DownCircle',
-  'LeftCircle',
-  'RightCircle',
-  'DoubleRight',
-  'DoubleLeft',
-  'VerticalLeft',
-  'VerticalRight',
-  'VerticalAlignTop',
-  'VerticalAlignMiddle',
-  'VerticalAlignBottom',
-  'Forward',
-  'Backward',
-  'Rollback',
-  'Enter',
-  'Retweet',
-  'Swap',
-  'SwapLeft',
-  'SwapRight',
-  'ArrowUp',
-  'ArrowDown',
-  'ArrowLeft',
-  'ArrowRight',
-  'PlayCircle',
-  'UpSquare',
-  'DownSquare',
-  'LeftSquare',
-  'RightSquare',
-  'Login',
-  'Logout',
-  'MenuFold',
-  'MenuUnfold',
-  'BorderBottom',
-  'BorderHorizontal',
-  'BorderInner',
-  'BorderOuter',
-  'BorderLeft',
-  'BorderRight',
-  'BorderTop',
-  'BorderVerticle',
-  'PicCenter',
-  'PicLeft',
-  'PicRight',
-  'RadiusBottomleft',
-  'RadiusBottomright',
-  'RadiusUpleft',
-  'RadiusUpright',
-  'Fullscreen',
-  'FullscreenExit',
+  'ArrowUpCircle',
+  'PopOut',
+  'Drilldown',
+  'FoldOut',
+  'StepDown',
+  'StepOver',
+  'StepUp',
 ];
 
 const suggestion = [
@@ -98,39 +42,26 @@ const suggestion = [
 ];
 
 const editor = [
-  'Edit',
-  'Form',
-  'Copy',
-  'Scissor',
-  'Delete',
-  'Snippets',
-  'Diff',
-  'Highlight',
-  'AlignCenter',
-  'AlignLeft',
-  'AlignRight',
-  'BgColors',
-  'Bold',
-  'Italic',
-  'Underline',
-  'Strikethrough',
-  'Redo',
-  'Undo',
-  'ZoomIn',
-  'ZoomOut',
-  'FontColors',
-  'FontSize',
-  'LineHeight',
-  'Dash',
-  'SmallDash',
-  'SortAscending',
-  'SortDescending',
-  'Drag',
-  'OrderedList',
-  'UnorderedList',
-  'RadiusSetting',
-  'ColumnWidth',
-  'ColumnHeight',
+  'CodeSlash',
+  'CompileAll',
+  'Compile',
+  'FunctionBold',
+  'LetterLower',
+  'Letter',
+  'LetterUpper',
+  'Numeral',
+  'Parameter',
+  'Variable',
+  'Sql',
+  'PlConsole',
+  'Pl',
+  'Procedure',
+  'UndoFlat',
+  'RedoFlat',
+  'RunAll',
+  'RunCurrent',
+  'Run',
+  'Terminate',
 ];
 
 const data = [
@@ -149,64 +80,74 @@ const data = [
   'Sliders',
 ];
 
+const oceanbase = [
+  'Oceanbase',
+  'ObMysql',
+  'ObOracle',
+  'ObCluster',
+  'ObTenant',
+  'ObProxy',
+  'Ocp',
+  'Oms',
+  'Oma',
+  'Odc',
+  'Oat',
+];
+
 const logo = [
-  'Android',
-  'Apple',
-  'Windows',
-  'Ie',
-  'Chrome',
-  'Github',
-  'Aliwangwang',
-  'Dingding',
-  'WeiboSquare',
-  'WeiboCircle',
-  'TaobaoCircle',
-  'Html5',
-  'Weibo',
-  'Twitter',
-  'Wechat',
-  'Youtube',
-  'AlipayCircle',
-  'Taobao',
-  'Skype',
-  'Qq',
-  'MediumWorkmark',
-  'Gitlab',
-  'Medium',
-  'Linkedin',
-  'GooglePlus',
-  'Dropbox',
-  'Facebook',
-  'Codepen',
-  'CodeSandbox',
-  'CodeSandboxCircle',
-  'Amazon',
-  'Google',
-  'CodepenCircle',
-  'Alipay',
-  '@oceanbase/designesign',
-  'AntCloud',
+  // cloud
   'Aliyun',
-  'Zhihu',
-  'Slack',
-  'SlackSquare',
-  'Behance',
-  'BehanceSquare',
-  'Dribbble',
-  'DribbbleSquare',
-  'Instagram',
-  'Yuque',
-  'Alibaba',
-  'Yahoo',
-  'Reddit',
-  'Sketch',
+  'Aws',
+  'GoogleCloud',
+  'TencentCloud',
+  'HuaweiCloud',
+  // database
+  'Mysql',
+  'Oracle',
+  'Polardb',
+  'Postgresql',
+  'Tidb',
+  'MysqlSquare',
+  'OracleSquare',
+  // language
+  'C',
+  'Go',
+  'Java',
+  'Php',
+  'Python',
+  // tool
+  'Navicat',
+  'Dbeaver',
+  'Bytebase',
+  'Grafana',
+  'Prometheus',
+  'Datadog',
+  'Flink',
+  'Canal',
+  'Kafka',
+  'Rocketmq',
+  'Liquibase',
+  'Datafold',
+  'Datagrip',
+  'Datahub',
+  'Dbt',
+  'DolphinScheduler',
+  'Informatica',
+  'Maxwell',
+  'Nifi',
+  'Powerbi',
+  'Airflow',
+  'Superset',
+  'Tableau',
+  'Douyin',
 ];
 
-const datum = [...direction, ...suggestion, ...editor, ...data, ...logo];
+const datum = [...oceanbase, ...direction, ...suggestion, ...editor, ...data, ...logo];
 
 const other = all.filter(n => !datum.includes(n));
 
 export const categories = {
+  oceanbase,
   direction,
   suggestion,
   editor,

diff --git a/.dumi/theme/builtins/IconSearch/index.tsx b/.dumi/theme/builtins/IconSearch/index.tsx
@@ -1,6 +1,6 @@
 import React, { useCallback, useMemo, useState } from 'react';
 import type { CSSProperties } from 'react';
-import Icon, * as ObIcons from '@oceanbase/icons';
+import Icon, * as AllIcons from '@oceanbase/icons';
 import * as AntdIcons from '@ant-design/icons';
 import type { IntlShape } from 'react-intl';
 import { Segmented, Input, Empty, Affix } from '@oceanbase/design';
@@ -10,7 +10,7 @@ import { useIntl } from 'dumi';
 import debounce from 'lodash/debounce';
 import difference from 'lodash/difference';
 import Category from './Category';
-import { FilledIcon, OutlinedIcon, TwoToneIcon } from './themeIcons';
+import { FilledIcon, OutlinedIcon, TwoToneIcon, ColoredIcon } from './themeIcons';
 import type { CategoriesKeys } from './fields';
 import { categories } from './fields';
 import useSiteToken from '../../../hooks/useSiteToken';
@@ -22,8 +22,6 @@ export enum ThemeType {
   Colored = 'Colored',
 }
 
-const allIcons: { [key: string]: any } = ObIcons;
-
 const useStyle = () => ({
   iconSearchAffix: css`
     display: flex;
@@ -43,10 +41,15 @@ const options = (intl: IntlShape): SegmentedProps['options'] => [
     icon: <Icon component={FilledIcon} />,
     label: intl.formatMessage({ id: 'app.docs.components.icon.filled' }),
   },
+  // {
+  //   value: ThemeType.TwoTone,
+  //   icon: <Icon component={TwoToneIcon} />,
+  //   label: intl.formatMessage({ id: 'app.docs.components.icon.two-tone' }),
+  // },
   {
-    value: ThemeType.TwoTone,
+    value: ThemeType.Colored,
     icon: <Icon component={TwoToneIcon} />,
-    label: intl.formatMessage({ id: 'app.docs.components.icon.two-tone' }),
+    label: intl.formatMessage({ id: 'app.docs.components.icon.colored' }),
   },
 ];
 
@@ -63,7 +66,7 @@ const IconSearch: React.FC = () => {
     theme: ThemeType.Outlined,
   });
 
-  const newIconNames: string[] = difference(Object.keys(allIcons), Object.keys(AntdIcons));
+  const newIconNames: string[] = difference(Object.keys(AllIcons), Object.keys(AntdIcons));
 
   const handleSearchIcon = debounce((e: React.ChangeEvent<HTMLInputElement>) => {
     setDisplayState(prevState => ({ ...prevState, searchKey: e.target.value }));
@@ -83,7 +86,7 @@ const IconSearch: React.FC = () => {
           const matchKey = searchKey
             // eslint-disable-next-line prefer-regex-literals
             .replace(new RegExp(`^<([a-zA-Z]*)\\s/>$`, 'gi'), (_, name) => name)
-            .replace(/(Filled|Outlined|TwoTone)$/, '')
+            .replace(/(Filled|Outlined|TwoTone|Gray|Colored)$/, '')
             .toLowerCase();
           iconList = iconList.filter(iconName => iconName.toLowerCase().includes(matchKey));
         }
@@ -96,7 +99,9 @@ const IconSearch: React.FC = () => {
 
         return {
           category: key,
-          icons: iconList.map(iconName => iconName + theme).filter(iconName => allIcons[iconName]),
+          icons: iconList
+            .map(iconName => iconName + theme)
+            .filter(iconName => newIconNames.includes(iconName)),
         };
       })
       .filter(({ icons }) => !!icons.length)
@@ -106,7 +111,8 @@ const IconSearch: React.FC = () => {
           title={category as CategoriesKeys}
           theme={theme}
           icons={icons}
-          newIcons={newIconNames}
+          // newIcons={newIconNames}
+          newIcons={[]}
         />
       ));
     return categoriesResult.length ? categoriesResult : <Empty style={{ margin: '2em 0' }} />;

diff --git a/.dumi/theme/builtins/IconSearch/themeIcons.tsx b/.dumi/theme/builtins/IconSearch/themeIcons.tsx
@@ -43,3 +43,40 @@ export const TwoToneIcon: CustomIconComponent = props => {
     </svg>
   );
 };
+
+export const ColoredIcon: CustomIconComponent = props => {
+  return (
+    <svg {...props} viewBox="0 0 1024 1024">
+      <path
+        style={{ fill: '#E64C3C' }}
+        d="M4.645,45.577c-0.017-0.383-0.029-0.767-0.029-1.154c0-13.997,11.387-25.385,25.385-25.385
+	s25.385,11.387,25.385,25.385c0,0.387-0.012,0.771-0.029,1.154h4.616C59.985,45.193,60,44.81,60,44.423c0-16.569-13.431-30-30-30
+	s-30,13.431-30,30c0,0.387,0.015,0.77,0.029,1.154H4.645z"
+      />
+      <path
+        style={{ fill: '#F0C419' }}
+        d="M9.289,45.577c-0.021-0.384-0.058-0.764-0.058-1.154c0-11.452,9.317-20.769,20.769-20.769
+	s20.769,9.318,20.769,20.769c0,0.389-0.037,0.77-0.058,1.154h4.645c0.017-0.383,0.029-0.767,0.029-1.154
+	c0-13.997-11.387-25.385-25.385-25.385S4.615,30.426,4.615,44.423c0,0.387,0.012,0.771,0.029,1.154H9.289z"
+      />
+      <path
+        style={{ fill: '#71C285' }}
+        d="M13.905,45.577c-0.027-0.383-0.058-0.764-0.058-1.154c0-8.907,7.246-16.154,16.154-16.154
+	s16.154,7.246,16.154,16.154c0,0.389-0.031,0.771-0.058,1.154h4.615c0.021-0.384,0.058-0.764,0.058-1.154
+	c0-11.452-9.317-20.769-20.769-20.769S9.231,32.971,9.231,44.423c0,0.389,0.037,0.77,0.058,1.154H13.905z"
+      />
+      <path
+        style={{ fill: '#0096E6' }}
+        d="M18.52,45.577c-0.038-0.38-0.058-0.764-0.058-1.154c0-6.362,5.176-11.538,11.538-11.538
+	s11.538,5.177,11.538,11.538c0,0.389-0.021,0.774-0.058,1.154h4.615c0.027-0.383,0.058-0.764,0.058-1.154
+	c0-8.907-7.246-16.154-16.154-16.154s-16.154,7.246-16.154,16.154c0,0.389,0.031,0.771,0.058,1.154H18.52z"
+      />
+      <path
+        style={{ fill: '#546A79' }}
+        d="M23.181,45.577c-0.064-0.376-0.104-0.76-0.104-1.154c0-3.818,3.105-6.923,6.923-6.923
+	s6.923,3.105,6.923,6.923c0,0.394-0.041,0.778-0.104,1.154h4.661c0.038-0.38,0.058-0.764,0.058-1.154
+	c0-6.362-5.176-11.538-11.538-11.538s-11.538,5.177-11.538,11.538c0,0.389,0.021,0.774,0.058,1.154H23.181z"
+      />
+    </svg>
+  );
+};