refactor editos

src/components/common/CellGrid/index.tsx

@@ -0,0 +1,22 @@
+import React, { FC, HTMLAttributes } from 'react';
+
+import classNames from 'classnames';
+
+import styles from './styles.module.scss';
+
+type IProps = HTMLAttributes<HTMLDivElement> & {
+  children: any;
+  size: number;
+};
+
+const CellGrid: FC<IProps> = ({ children, size, className, ...props }) => (
+  <div
+    className={classNames(styles.grid, className)}
+    style={{ gridTemplateColumns: `repeat(auto-fit, minmax(${size}px, 1fr))` }}
+    {...props}
+  >
+    {children}
+  </div>
+);
+
+export { CellGrid };

src/components/common/CellGrid/styles.module.scss

@@ -0,0 +1,8 @@
+@import "src/styles/variables";
+
+.grid {
+  display: grid;
+  grid-auto-rows: 1fr;
+  grid-column-gap: $gap;
+  grid-row-gap: $gap;
+}