Инициализация в новом репозитории

FRONT/DEV/src/const/buttons/icons.tsx

@@ -0,0 +1,58 @@
+import React from "react";
+import { buttonNames } from "./names";
+import { useTheme } from "styled-components";
+import { Icon } from '@iconify/react';
+
+import exitToApp from '@iconify/icons-ic/twotone-exit-to-app';
+import deleteIcon from '@iconify/icons-ic/baseline-delete';
+import settings from '@iconify/icons-ic/baseline-settings';
+import info from '@iconify/icons-ic/baseline-info';
+import arrowDown from '@iconify/icons-ic/baseline-keyboard-arrow-down';
+import arrowRight from '@iconify/icons-ic/baseline-keyboard-arrow-right';
+import edit from '@iconify/icons-ic/baseline-edit';
+import checkCircle from '@iconify/icons-ic/round-check-circle';
+import cancel from '@iconify/icons-ic/baseline-cancel';
+import admin from '@iconify/icons-ic/baseline-admin-panel-settings';
+import noAdmin from '@iconify/icons-ic/baseline-remove-moderator'
+import refresh from '@iconify/icons-ic/baseline-refresh';
+import close from '@iconify/icons-ic/round-close';
+
+export const ICONS = {
+    [buttonNames[1]]: exitToApp,
+    [buttonNames[2]]: deleteIcon,
+    [buttonNames[3]]: settings,
+    [buttonNames[4]]: info,
+    [buttonNames[5]]: arrowDown,
+    [buttonNames[6]]: arrowRight,
+    [buttonNames[7]]: edit,
+    [buttonNames[8]]: checkCircle,
+    [buttonNames[9]]: cancel,
+    [buttonNames[10]]: admin,
+    [buttonNames[11]]: refresh,
+    [buttonNames[12]]: close,
+    [buttonNames[13]]: noAdmin
+    
+} as const;
+
+type IconName = keyof typeof ICONS;
+
+interface IconsProps {
+    name: IconName,
+    width?: string
+    height?: string
+    setColor?: string
+    onClick?: (event?: React.MouseEvent<SVGSVGElement>) => void;
+}
+
+export const IconComponent = ({ name, width = "24", height = "24", setColor, onClick}: IconsProps) => {
+    const theme = useTheme();
+    return (
+        <Icon 
+            icon={ICONS[name]} 
+            width={width} 
+            height={height} 
+            color={setColor || theme.textColor} 
+            onClick={onClick} 
+        />
+    );
+}