feat(reports): export multiple S-21 cards (#2524)

converter/svg/convert.js

@@ -53,14 +53,21 @@ for await (const svgFile of svgFiles) {
     !specialIcons.includes(componentName) ? `color = '#222222', ` : ''
   }width = 24, height = 24, sx = {}, className }: IconProps) => {
     return (
-      <SvgIcon className={} sx={{ width: widthPx, height: heightPx, ...sx }}>`;
+      <SvgIcon className={} sx={{ width: widthPx, height: heightPx, animation, ...sx }}>`;
 
   data = data.replace('widthPx', '`${width}px`');
   data = data.replace('heightPx', '`${height}px`');
   data = data.replace(
     'className={}',
     'className={`organized-icon-${iconName} ${className}`}'
   );
+
+  if (componentName === 'IconLoading') {
+    data.replace(' animation,', ' animation: rotate 2s linear infinite,');
+  } else {
+    data.replace(' animation,', '');
+  }
+
   data = data.replace('${iconName}', originalName);
 
   const filePath = path.join(ROOT_FOLDER, svgFile);
@@ -97,21 +104,6 @@ for await (const svgFile of svgFiles) {
   svgContent = svgContent.replaceAll('stroke-width', 'strokeWidth');
   svgContent = svgContent.replaceAll('stroke-dasharray', 'strokeDasharray');
 
-  if (componentName === 'IconLoading') {
-    svgContent = svgContent.replace(
-      '</g>',
-      `<animateTransform
-          attributeName="transform"
-          type="rotate"
-          from="0 12 12"
-          to="360 12 12"
-          dur="2s"
-          repeatCount="indefinite"
-        />
-      </g>`
-    );
-  }
-
   data += svgContent;
 
   data += `

eslint.config.js

@@ -0,0 +1,66 @@
+import globals from 'globals';
+import pluginJs from '@eslint/js';
+import tseslint from 'typescript-eslint';
+import pluginReact from 'eslint-plugin-react';
+import reactRefresh from 'eslint-plugin-react-refresh';
+import importPlugin from 'eslint-plugin-import';
+
+// eslint-disable-next-line import/no-anonymous-default-export
+export default [
+  { files: ['**/*.{js,mjs,cjs,ts,jsx,tsx}'] },
+  { languageOptions: { globals: globals.browser } },
+  pluginJs.configs.recommended,
+  ...tseslint.configs.recommended,
+  pluginReact.configs.flat.recommended,
+  {
+    plugins: {
+      'react-refresh': reactRefresh,
+      import: importPlugin,
+    },
+    settings: {
+      react: { version: '18.2' },
+      'import/resolver': {
+        typescript: {},
+        node: {
+          extensions: ['.js', '.jsx', '.ts', '.tsx'],
+        },
+        alias: {
+          extensions: ['.js', '.jsx', '.ts', '.tsx'],
+          map: [
+            ['@assets', './src/assets'],
+            ['@components', './src/components'],
+            ['@icons', './src/components/icons'],
+            ['@constants', './src/constants'],
+            ['@features', './src/features'],
+            ['@hooks', './src/hooks'],
+            ['@layouts', './src/layouts'],
+            ['@pages', './src/pages'],
+            ['@routes', './src/routes'],
+            ['@services', './src/services'],
+            ['@states', './src/states'],
+            ['@utils', './src/utils'],
+            ['@wrapper', './src/wrapper'],
+            ['@locales', './src/locales'],
+            ['@definition', './src/definition'],
+            ['@global', './src/global'],
+            ['@db', './src/indexedDb'],
+            ['@talks', './src/public_talks'],
+            ['@views', './src/views'],
+          ],
+        },
+      },
+    },
+    rules: {
+      'react/react-in-jsx-scope': 'off',
+      'react-refresh/only-export-components': [
+        'warn',
+        {
+          allowConstantExport: true,
+        },
+      ],
+      'react/jsx-uses-react': 'error',
+      'react/jsx-uses-vars': 'error',
+      'import/no-cycle': ['error', { maxDepth: 9999 }],
+    },
+  },
+];