perf: usages list；perf: move components (#3654)

* perf: usages list

* team sub plan load

* perf: usage dashboard code

* perf: dashboard ui

* perf: move components

packages/web/components/common/String/CopyBox.tsx

@@ -0,0 +1,24 @@
+import { useCopyData } from '../../../hooks/useCopyData';
+import React from 'react';
+import MyTooltip from '../MyTooltip';
+import { useTranslation } from 'next-i18next';
+import { Box, BoxProps } from '@chakra-ui/react';
+
+const CopyBox = ({
+  value,
+  children,
+  ...props
+}: { value: string; children: React.ReactNode } & BoxProps) => {
+  const { copyData } = useCopyData();
+  const { t } = useTranslation();
+
+  return (
+    <MyTooltip label={t('common:click_to_copy')}>
+      <Box cursor={'pointer'} onClick={() => copyData(value)} {...props}>
+        {children}
+      </Box>
+    </MyTooltip>
+  );
+};
+
+export default CopyBox;