refactor boris components

src/components/boris/BorisUIDemo/index.tsx

@@ -1,77 +0,0 @@
-import { FC, useState } from 'react';
-
-import { Card } from '~/components/containers/Card';
-import { Group } from '~/components/containers/Group';
-import { Button } from '~/components/input/Button';
-import { InputText } from '~/components/input/InputText';
-import markdown from '~/styles/common/markdown.module.scss';
-
-import styles from './styles.module.scss';
-
-interface IProps {}
-
-const BorisUIDemo: FC<IProps> = () => {
-  const [text, setText] = useState('');
-
-  return (
-    <Card className={styles.card}>
-      <div className={markdown.wrapper}>
-        <h1>UI</h1>
-        <p>
-          Простая демонстрация элементов интерфейса. Используется, в основном,
-          как подсказка при разработке
-        </p>
-
-        <h2>Инпуты</h2>
-
-        <form autoComplete="off">
-          <Group>
-            <InputText title="Обычный инпут" handler={setText} value={text} />
-            <InputText
-              title="Инпут с ошибкой"
-              error="Ошибка"
-              handler={setText}
-              value={text}
-            />
-            <InputText
-              title="Пароль"
-              type="password"
-              handler={setText}
-              value={text}
-            />
-          </Group>
-        </form>
-
-        <h2>Кнопки</h2>
-
-        <h4>Цвета</h4>
-
-        <Group horizontal className={styles.sample}>
-          <Button>Primary</Button>
-          <Button color="outline">Outline</Button>
-          <Button color="gray">Gray</Button>
-          <Button color="link">Link</Button>
-        </Group>
-
-        <h4>Размеры</h4>
-
-        <Group horizontal className={styles.sample}>
-          <Button size="micro">Micro</Button>
-          <Button size="mini">Mini</Button>
-          <Button size="normal">Normal</Button>
-          <Button size="big">Big</Button>
-          <Button size="giant">Giant</Button>
-        </Group>
-
-        <h4>Варианты</h4>
-        <Group horizontal className={styles.sample}>
-          <Button iconRight="check">iconRight</Button>
-          <Button iconLeft="send">iconLeft</Button>
-          <Button round>Round</Button>
-        </Group>
-      </div>
-    </Card>
-  );
-};
-
-export { BorisUIDemo };

src/components/boris/BorisUIDemo/styles.module.scss

@@ -1,14 +0,0 @@
-@import 'src/styles/variables.scss';
-
-.card {
-  flex: 3;
-  align-self: stretch;
-  position: relative;
-  z-index: 1;
-  padding: 20px 30px;
-  background-color: $content_bg_lighter;
-}
-
-.sample {
-  flex-wrap: wrap;
-}

src/containers/auth/SuperPowersToggle/index.tsx

@@ -2,10 +2,11 @@ import { FC } from 'react';
 
 import { observer } from 'mobx-react-lite';
 
-import { BorisSuperpowers } from '~/components/boris/BorisSuperpowers';
 import { useAuth } from '~/hooks/auth/useAuth';
 import { useSuperPowers } from '~/hooks/auth/useSuperPowers';
 
+import { BorisSuperpowers } from './components/BorisSuperpowers';
+
 interface SuperPowersToggleProps {}
 
 const SuperPowersToggle: FC<SuperPowersToggleProps> = observer(() => {

src/containers/boris/BorisSidebar/components/BorisContacts/index.tsx

@@ -1,9 +1,9 @@
 import React, { FC } from 'react';
 
-import { BorisContactItem } from '~/components/boris/BorisContactItem';
 import { Padder } from '~/components/containers/Padder';
 import { Button } from '~/components/input/Button';
 
+import { BorisContactItem } from './components/BorisContactItem';
 import styles from './styles.module.scss';
 
 interface Props {

src/containers/boris/BorisSidebar/components/BorisStats/components/BorisGraphicStats/index.tsx

@@ -1,7 +1,6 @@
 import React, { VFC } from 'react';
 
-
+import { StatsGraphCard } from '../StatsGraphCard';
-import { StatsGraphCard } from '~/components/charts/StatsGraphCard';
 
 import styles from './styles.module.scss';
 

src/containers/boris/BorisSidebar/components/BorisStats/components/BorisStatsBackend/index.tsx

@@ -1,11 +1,12 @@
 import { FC, useMemo } from 'react';
 
-import { BorisGraphicStats } from '~/components/boris/BorisGraphicStats';
 import { StatsRow } from '~/components/common/StatsRow';
 import { SubTitle } from '~/components/common/SubTitle';
 import { StatBackend } from '~/types/boris';
 import { sizeOf } from '~/utils/dom';
 
+import { BorisGraphicStats } from '../BorisGraphicStats';
+
 import styles from './styles.module.scss';
 
 interface IProps {

src/containers/boris/BorisSidebar/components/BorisStats/components/StatsCountdownCard/index.tsx

@@ -3,21 +3,29 @@ import React, { VFC } from 'react';
 import classNames from 'classnames';
 import { addYears, differenceInMonths, differenceInYears } from 'date-fns';
 
-import { StatsCard } from '~/components/charts/StatsCard';
 import { CardProps } from '~/components/containers/Card';
 
+import { StatsCard } from '../StatsCard';
+
 import styles from './styles.module.scss';
 
 interface StatsCountdownCardProps extends CardProps {
   since: Date;
 }
 
-const StatsCountdownCard: VFC<StatsCountdownCardProps> = ({ since, ...props }) => {
+const StatsCountdownCard: VFC<StatsCountdownCardProps> = ({
+  since,
+  ...props
+}) => {
   const years = differenceInYears(new Date(), since);
   const months = differenceInMonths(new Date(), addYears(since, years));
 
   return (
-    <StatsCard {...props} title="Нам уже" className={classNames(styles.card, props.className)}>
+    <StatsCard
+      {...props}
+      title="Нам уже"
+      className={classNames(styles.card, props.className)}
+    >
       <div className={styles.content}>
         {years > 0 && (
           <>

src/containers/boris/BorisSidebar/components/BorisStats/components/StatsGraphCard/index.tsx

@@ -1,10 +1,11 @@
 import React, { VFC } from 'react';
 
-import { BasicCurveChart } from '~/components/charts/BasicCurveChart';
-import { StatsCard } from '~/components/charts/StatsCard';
 import { CardProps } from '~/components/containers/Card';
 import { Filler } from '~/components/containers/Filler';
 
+import { BasicCurveChart } from '../BasicCurveChart';
+import { StatsCard } from '../StatsCard';
+
 import styles from './styles.module.scss';
 
 interface StatsGraphCardProps extends CardProps {

src/containers/boris/BorisSidebar/components/BorisStats/index.tsx

@@ -2,8 +2,8 @@ import React, { FC } from 'react';
 
 import { BorisUsageStats } from '~/types/boris';
 
-import { BorisStatsBackend } from '../BorisStatsBackend';
+import { BorisStatsBackend } from './components/BorisStatsBackend';
-import { BorisStatsGit } from '../BorisStatsGit';
+import { BorisStatsGit } from './components/BorisStatsGit';
 
 interface IProps {
   stats: BorisUsageStats;

src/containers/boris/BorisSidebar/index.tsx

@@ -1,12 +1,12 @@
 import { FC } from 'react';
 
-import { BorisContacts } from '~/components/boris/BorisContacts';
-import { BorisStats } from '~/components/boris/BorisStats';
 import { Group } from '~/components/containers/Group';
 import { SuperPowersToggle } from '~/containers/auth/SuperPowersToggle';
 import { useTelegramAccount } from '~/hooks/auth/useTelegramAccount';
 import { BorisUsageStats } from '~/types/boris';
 
+import { BorisContacts } from './components/BorisContacts';
+import { BorisStats } from './components/BorisStats';
 import styles from './styles.module.scss';
 
 interface Props {

src/containers/flow/FlowStamp/index.tsx

@@ -2,7 +2,7 @@ import React, { FC, FormEvent, useCallback, useMemo } from 'react';
 
 import classNames from 'classnames';
 
-import { Superpower } from '~/components/boris/Superpower';
+import { Superpower } from '~/components/common/Superpower';
 import { Group } from '~/components/containers/Group';
 import { FlowRecent } from '~/components/flow/FlowRecent';
 import { FlowSearchResults } from '~/components/flow/FlowSearchResults';
@@ -38,22 +38,27 @@ const FlowStamp: FC<IProps> = ({ isFluid, onToggleLayout }) => {
   const onClearSearch = useCallback(() => setSearchText(''), [setSearchText]);
 
   const onKeyUp = useCallback(
-    event => {
+    (event) => {
       if (event.key !== 'Escape') return;
       onClearSearch();
       event.target.blur();
     },
-    [onClearSearch]
+    [onClearSearch],
   );
 
   const after = useMemo(
     () =>
       searchText ? (
-        <Icon icon="close" size={24} className={styles.close_icon} onClick={onClearSearch} />
+        <Icon
+          icon="close"
+          size={24}
+          className={styles.close_icon}
+          onClick={onClearSearch}
+        />
       ) : (
         <Icon icon="search" size={24} className={styles.search_icon} />
       ),
-    [onClearSearch, searchText]
+    [onClearSearch, searchText],
   );
 
   return (
@@ -102,7 +107,11 @@ const FlowStamp: FC<IProps> = ({ isFluid, onToggleLayout }) => {
       {experimentalFeatures.liquidFlow && (
         <Superpower>
           <div className={styles.toggles}>
-            <Group horizontal onClick={onToggleLayout} className={styles.fluid_toggle}>
+            <Group
+              horizontal
+              onClick={onToggleLayout}
+              className={styles.fluid_toggle}
+            >
               <Toggle value={isFluid} />
               <div className={styles.toggles__label}>Жидкое течение</div>
             </Group>

src/containers/settings/UserSettingsView/index.tsx

@@ -1,6 +1,6 @@
 import { FC } from 'react';
 
-import { Superpower } from '~/components/boris/Superpower';
+import { Superpower } from '~/components/common/Superpower';
 import { Filler } from '~/components/containers/Filler';
 import { Group } from '~/components/containers/Group';
 import { Zone } from '~/components/containers/Zone';

src/layouts/BorisLayout/index.tsx

@@ -2,7 +2,7 @@ import { FC } from 'react';
 
 import { observer } from 'mobx-react-lite';
 
-import { Superpower } from '~/components/boris/Superpower';
+import { Superpower } from '~/components/common/Superpower';
 import { Card } from '~/components/containers/Card';
 import { Group } from '~/components/containers/Group';
 import { Sticky } from '~/components/containers/Sticky';

src/layouts/NodeLayout/index.tsx

@@ -2,8 +2,8 @@ import React, { useCallback } from 'react';
 
 import { observer } from 'mobx-react-lite';
 
-import { Superpower } from '~/components/boris/Superpower';
 import { ScrollHelperBottom } from '~/components/common/ScrollHelperBottom';
+import { Superpower } from '~/components/common/Superpower';
 import { Card } from '~/components/containers/Card';
 import { Footer } from '~/components/main/Footer';
 import { NodeTitle } from '~/components/node/NodeTitle';