From bf98ff90a7ad9fad79f75a2215108dcfdaa02ed2 Mon Sep 17 00:00:00 2001
From: Eug-VS <eug-vs@keemail.me>
Date: Tue, 28 Jan 2020 17:00:00 +0300
Subject: feat!: install Typescript, migrate Window to .tsx

---
 src/lib/components/Window/Window.js                | 55 -------------------
 src/lib/components/Window/Window.tsx               | 63 ++++++++++++++++++++++
 src/lib/components/Window/WindowSurface.tsx        | 46 ++++++++++++++++
 .../Window/WindowSurface/WindowSurface.js          | 36 -------------
 src/lib/components/Window/types.d.ts               | 11 ++++
 5 files changed, 120 insertions(+), 91 deletions(-)
 delete mode 100644 src/lib/components/Window/Window.js
 create mode 100644 src/lib/components/Window/Window.tsx
 create mode 100644 src/lib/components/Window/WindowSurface.tsx
 delete mode 100644 src/lib/components/Window/WindowSurface/WindowSurface.js
 create mode 100644 src/lib/components/Window/types.d.ts

(limited to 'src/lib/components')

diff --git a/src/lib/components/Window/Window.js b/src/lib/components/Window/Window.js
deleted file mode 100644
index 027213f..0000000
--- a/src/lib/components/Window/Window.js
+++ /dev/null
@@ -1,55 +0,0 @@
-import React from 'react';
-
-import { Typography, Divider, makeStyles } from '@material-ui/core';
-
-import WindowSurface from './WindowSurface/WindowSurface';
-
-
-const useStyles = makeStyles(theme => ({
-  header: {
-    padding: theme.spacing(1, 0, 1, 2),
-    background: theme.palette.background.elevation2,
-  },
-}));
-
-
-const Window = ({ type, name, children }) => {
-  const classes = useStyles();
-
-  const size = {
-    height: '85vh',
-  };
-
-  const position = {
-    bottom: '3vh',
-  };
-
-  if (type === 'primary') {
-    size.width = '63vw';
-    position.left = '2vw';
-  } else if (type === 'secondary') {
-    size.width = '31vw';
-    position.right = '2vw';
-  } else if (type === 'mono') {
-    position.left = '2vw';
-    position.right = '2vw';
-  }
-
-  return (
-    <WindowSurface
-      size={size}
-      position={position}
-    >
-      {name &&
-      <div>
-        <Typography variant="h5" className={classes.header}>{name}</Typography>
-        <Divider />
-      </div>
-      }
-      {children}
-    </WindowSurface>
-  );
-};
-
-
-export default Window;
diff --git a/src/lib/components/Window/Window.tsx b/src/lib/components/Window/Window.tsx
new file mode 100644
index 0000000..4821cb3
--- /dev/null
+++ b/src/lib/components/Window/Window.tsx
@@ -0,0 +1,63 @@
+import React from 'react';
+
+import { Typography, Divider, makeStyles } from '@material-ui/core';
+
+import WindowSurface from './WindowSurface';
+import { SurfaceSize, SurfacePosition } from './types';
+
+
+interface PropTypes {
+  type: 'primary' | 'secondary' | 'mono';
+  name?: string;
+  children?: any;
+}
+
+
+const useStyles = makeStyles((theme: any) => ({
+  header: {
+    padding: theme.spacing(1, 0, 1, 2),
+    background: theme.palette.background.elevation2,
+  },
+}));
+
+
+const Window = (props: PropTypes) => {
+  const classes = useStyles();
+  const { type, name, children } = props;
+
+  const size: SurfaceSize = {
+    height: '85vh',
+  };
+
+  const position: SurfacePosition = {
+    bottom: '3vh',
+  };
+
+  if (type === 'primary') {
+    size.width = '63vw';
+    position.left = '2vw';
+  } else if (type === 'secondary') {
+    size.width = '31vw';
+    position.right = '2vw';
+  } else if (type === 'mono') {
+    position.left = '2vw';
+    position.right = '2vw';
+  }
+
+  return (
+    <WindowSurface
+      size={size}
+      position={position}
+    >
+      {name &&
+      <div>
+        <Typography variant="h5" className={classes.header}>{name}</Typography>
+        <Divider />
+      </div>
+      }
+      {children}
+    </WindowSurface>
+  );
+};
+
+export default Window;
diff --git a/src/lib/components/Window/WindowSurface.tsx b/src/lib/components/Window/WindowSurface.tsx
new file mode 100644
index 0000000..aaaa984
--- /dev/null
+++ b/src/lib/components/Window/WindowSurface.tsx
@@ -0,0 +1,46 @@
+import React from 'react';
+
+import { Paper, makeStyles } from '@material-ui/core';
+
+import { SurfaceSize, SurfacePosition } from './types';
+
+
+interface PropTypes {
+  size: SurfaceSize;
+  position: SurfacePosition;
+  children?: any;
+}
+
+
+const useStyles = makeStyles((theme: any) => ({
+  surface: {
+    position: 'absolute',
+    display: 'flex',
+    flexDirection: 'column',
+    overflowY: 'auto',
+    scrollbarColor: `${theme.palette.secondary.dark} ${theme.palette.secondary.light}`,
+
+    '& a.MuiTypography-root': {
+      color: theme.palette.primary.light,
+    },
+  }
+}));
+
+
+const WindowSurface = (props: PropTypes) => {
+  const classes = useStyles();
+  const { size, position, children } = props;
+
+  return (
+    <Paper
+      variant="outlined"
+      style={{...size, ...position}}
+      className={classes.surface}
+    >
+      {children}
+    </Paper>
+  )
+};
+
+
+export default WindowSurface;
diff --git a/src/lib/components/Window/WindowSurface/WindowSurface.js b/src/lib/components/Window/WindowSurface/WindowSurface.js
deleted file mode 100644
index 7859bf6..0000000
--- a/src/lib/components/Window/WindowSurface/WindowSurface.js
+++ /dev/null
@@ -1,36 +0,0 @@
-import React from 'react';
-
-import { Paper, makeStyles } from '@material-ui/core';
-
-
-const useStyles = makeStyles(theme => ({
-  surface: {
-    position: 'absolute',
-    display: 'flex',
-    flexDirection: 'column',
-    overflowY: 'auto',
-    scrollbarColor: `${theme.palette.secondary.dark} ${theme.palette.secondary.light}`,
-
-    '& a.MuiTypography-root': {
-      color: theme.palette.primary.light,
-    },
-  }
-}));
-
-
-const WindowSurface = ({ size, position, children }) => {
-  const classes = useStyles();
-
-  return (
-    <Paper
-      variant="outlined"
-      style={{...size, ...position}}
-      className={classes.surface}
-    >
-      {children}
-    </Paper>
-  )
-};
-
-
-export default WindowSurface;
diff --git a/src/lib/components/Window/types.d.ts b/src/lib/components/Window/types.d.ts
new file mode 100644
index 0000000..9e18fe3
--- /dev/null
+++ b/src/lib/components/Window/types.d.ts
@@ -0,0 +1,11 @@
+export interface SurfaceSize {
+  height: string;
+  width?: string;
+}
+
+export interface SurfacePosition {
+  bottom: string;
+  left?: string;
+  right?: string;
+}
+
-- 
cgit v1.2.3


From f9ea123a86defb49c0519a1e8e4a74a26e9c9660 Mon Sep 17 00:00:00 2001
From: Eug-VS <eug-vs@keemail.me>
Date: Tue, 28 Jan 2020 21:51:27 +0300
Subject: feat: setup deploy-ready typescript config

---
 src/lib/components/Window/types.d.ts | 11 -----------
 src/lib/components/Window/types.ts   | 11 +++++++++++
 2 files changed, 11 insertions(+), 11 deletions(-)
 delete mode 100644 src/lib/components/Window/types.d.ts
 create mode 100644 src/lib/components/Window/types.ts

(limited to 'src/lib/components')

diff --git a/src/lib/components/Window/types.d.ts b/src/lib/components/Window/types.d.ts
deleted file mode 100644
index 9e18fe3..0000000
--- a/src/lib/components/Window/types.d.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-export interface SurfaceSize {
-  height: string;
-  width?: string;
-}
-
-export interface SurfacePosition {
-  bottom: string;
-  left?: string;
-  right?: string;
-}
-
diff --git a/src/lib/components/Window/types.ts b/src/lib/components/Window/types.ts
new file mode 100644
index 0000000..9e18fe3
--- /dev/null
+++ b/src/lib/components/Window/types.ts
@@ -0,0 +1,11 @@
+export interface SurfaceSize {
+  height: string;
+  width?: string;
+}
+
+export interface SurfacePosition {
+  bottom: string;
+  left?: string;
+  right?: string;
+}
+
-- 
cgit v1.2.3


From 5bcc9b41e59bf7215abf395ea899cdbc2d06db9a Mon Sep 17 00:00:00 2001
From: Eug-VS <eug-vs@keemail.me>
Date: Mon, 3 Feb 2020 14:51:10 +0300
Subject: feat: use React.FC<PropTypes> syntax

This approach is better because it allows to use destructuring
right in a function declaration without explicitly defining
children propety in PropTypes
---
 src/lib/components/Window/Window.tsx        | 4 +---
 src/lib/components/Window/WindowSurface.tsx | 4 +---
 2 files changed, 2 insertions(+), 6 deletions(-)

(limited to 'src/lib/components')

diff --git a/src/lib/components/Window/Window.tsx b/src/lib/components/Window/Window.tsx
index 4821cb3..ea8e264 100644
--- a/src/lib/components/Window/Window.tsx
+++ b/src/lib/components/Window/Window.tsx
@@ -9,7 +9,6 @@ import { SurfaceSize, SurfacePosition } from './types';
 interface PropTypes {
   type: 'primary' | 'secondary' | 'mono';
   name?: string;
-  children?: any;
 }
 
 
@@ -21,9 +20,8 @@ const useStyles = makeStyles((theme: any) => ({
 }));
 
 
-const Window = (props: PropTypes) => {
+const Window: React.FC<PropTypes> = ({ type, name, children }) => {
   const classes = useStyles();
-  const { type, name, children } = props;
 
   const size: SurfaceSize = {
     height: '85vh',
diff --git a/src/lib/components/Window/WindowSurface.tsx b/src/lib/components/Window/WindowSurface.tsx
index aaaa984..701a767 100644
--- a/src/lib/components/Window/WindowSurface.tsx
+++ b/src/lib/components/Window/WindowSurface.tsx
@@ -8,7 +8,6 @@ import { SurfaceSize, SurfacePosition } from './types';
 interface PropTypes {
   size: SurfaceSize;
   position: SurfacePosition;
-  children?: any;
 }
 
 
@@ -27,9 +26,8 @@ const useStyles = makeStyles((theme: any) => ({
 }));
 
 
-const WindowSurface = (props: PropTypes) => {
+const WindowSurface: React.FC<PropTypes> = ({ size, position, children }) => {
   const classes = useStyles();
-  const { size, position, children } = props;
 
   return (
     <Paper
-- 
cgit v1.2.3


From cc6c8e9109f1807ce48b061fa497535ab9f674e8 Mon Sep 17 00:00:00 2001
From: Eug-VS <eug-vs@keemail.me>
Date: Mon, 3 Feb 2020 16:37:43 +0300
Subject: feat: change src structure

---
 .../BenzinThemeProvider/BenzinThemeProvider.js     | 40 -------------
 .../components/ContentSection/ContentSection.js    | 37 ------------
 src/lib/components/Header/Header.js                | 67 ----------------------
 src/lib/components/SmartList/SmartList.js          | 28 ---------
 src/lib/components/Window/Window.tsx               | 61 --------------------
 src/lib/components/Window/WindowSurface.tsx        | 44 --------------
 src/lib/components/Window/types.ts                 | 11 ----
 7 files changed, 288 deletions(-)
 delete mode 100644 src/lib/components/BenzinThemeProvider/BenzinThemeProvider.js
 delete mode 100644 src/lib/components/ContentSection/ContentSection.js
 delete mode 100644 src/lib/components/Header/Header.js
 delete mode 100644 src/lib/components/SmartList/SmartList.js
 delete mode 100644 src/lib/components/Window/Window.tsx
 delete mode 100644 src/lib/components/Window/WindowSurface.tsx
 delete mode 100644 src/lib/components/Window/types.ts

(limited to 'src/lib/components')

diff --git a/src/lib/components/BenzinThemeProvider/BenzinThemeProvider.js b/src/lib/components/BenzinThemeProvider/BenzinThemeProvider.js
deleted file mode 100644
index 8e52ed4..0000000
--- a/src/lib/components/BenzinThemeProvider/BenzinThemeProvider.js
+++ /dev/null
@@ -1,40 +0,0 @@
-import React from 'react';
-import { createMuiTheme, ThemeProvider } from '@material-ui/core/styles';
-import { CssBaseline } from '@material-ui/core';
-import 'typeface-roboto';
-
-
-const benzinTheme = createMuiTheme({
-  palette: {
-    type: 'dark',
-    primary: {
-      main: '#ffa726',
-    },
-    secondary: {
-      main: '#9c27b0',
-    },
-    background: {
-      default: '#121212',
-      paper: '#1e1e1e',
-      elevation1: '#1e1e1e',
-      elevation2: '#232323',
-      elevation3: '#252525',
-    },
-    text: {
-      primary: '#f4f4f4',
-      secondary: 'rgba(255, 255, 255, 0.6)',
-    }
-  },
-});
-
-
-const BenzinThemeProvider = ({ children }) => (
-  <ThemeProvider theme={benzinTheme}>
-    <CssBaseline />
-    {children}
-  </ThemeProvider>
-);
-
-
-export default BenzinThemeProvider;
-
diff --git a/src/lib/components/ContentSection/ContentSection.js b/src/lib/components/ContentSection/ContentSection.js
deleted file mode 100644
index 461a9c2..0000000
--- a/src/lib/components/ContentSection/ContentSection.js
+++ /dev/null
@@ -1,37 +0,0 @@
-import React from 'react';
-
-import {
-  Typography,
-  Divider,
-  makeStyles
-} from '@material-ui/core';
-
-
-const useStyles = makeStyles(theme => ({
-  content: {
-    padding: theme.spacing(0, 2, 1, 2),
-    marginBottom: theme.spacing(1),
-
-    '& .MuiButton-root': {
-      margin: theme.spacing(1, 2, 2, 0),
-    },
-  },
-}));
-
-const ContentSection = ({ sectionName, children }) => {
-  const classes = useStyles();
-
-  return (
-    <>
-      <Typography variant="h4">{sectionName}</Typography>
-      <Divider variant="middle"/>
-      <Typography component="div" className={classes.content}>
-        {children}
-      </Typography>
-    </>
-  );
-
-};
-
-
-export default ContentSection;
diff --git a/src/lib/components/Header/Header.js b/src/lib/components/Header/Header.js
deleted file mode 100644
index 3ade7b3..0000000
--- a/src/lib/components/Header/Header.js
+++ /dev/null
@@ -1,67 +0,0 @@
-import React from 'react';
-
-import {
-  AppBar,
-  Tabs,
-  Tab,
-  Typography,
-  Toolbar,
-} from '@material-ui/core';
-
-import { makeStyles } from '@material-ui/core/styles';
-
-
-const useStyles = makeStyles(theme => ({
-  root: {
-    background: theme.palette.background.elevation2,
-    color: theme.palette.text.primary,
-    paddingLeft: theme.spacing(3),
-  },
-  logo: {
-    margin: theme.spacing(0, 3, 0, 1),
-  },
-  tab: {
-    '& .MuiTab-wrapper': {
-      padding: theme.spacing(2),
-      flexDirection: 'row',
-      fontSize: '0.8125rem',
-      '& svg': {
-        marginRight: theme.spacing(1),
-        marginBottom: '0 !important',
-      }
-    }
-  }
-}));
-
-
-const Header = ({ logo, contents, page, setPage }) => {
-  const classes = useStyles();
-
-  const handleChange = (event, newPage) => {
-    setPage(newPage);
-  };
-
-  return (
-  <AppBar position="sticky" className={classes.root}>
-    <Toolbar>
-      {logo.icon}
-      <Typography variant="h5" className={classes.logo} color="primary">
-        {logo.title}
-      </Typography>
-      <Tabs onChange={handleChange} value={page}>
-        {contents && Object.keys(contents).map(item => (
-          <Tab
-            label={item}
-            icon={contents[item]}
-            value={item}
-            className={classes.tab}
-            key={item}
-          />
-        ))}
-      </Tabs>
-    </Toolbar>
-  </AppBar>
-  );
-};
-
-export default Header;
diff --git a/src/lib/components/SmartList/SmartList.js b/src/lib/components/SmartList/SmartList.js
deleted file mode 100644
index b462c47..0000000
--- a/src/lib/components/SmartList/SmartList.js
+++ /dev/null
@@ -1,28 +0,0 @@
-import React from 'react';
-
-import { FixedSizeList } from 'react-window';
-import AutoSizer from 'react-virtualized-auto-sizer';
-
-
-const SmartList = ({ itemSize, itemCount, renderItem }) => {
-
-  return (
-    <div style={{ flex: '1 1 auto', overflow: 'hidden' }}>
-      <AutoSizer>
-        {({ width, height }) => (
-          <FixedSizeList
-            height={height}
-            width={width}
-            itemSize={itemSize}
-            itemCount={itemCount}
-          >
-            {renderItem}
-          </FixedSizeList>
-        )}
-      </AutoSizer>
-    </div>
-  );
-};
-
-
-export default SmartList;
diff --git a/src/lib/components/Window/Window.tsx b/src/lib/components/Window/Window.tsx
deleted file mode 100644
index ea8e264..0000000
--- a/src/lib/components/Window/Window.tsx
+++ /dev/null
@@ -1,61 +0,0 @@
-import React from 'react';
-
-import { Typography, Divider, makeStyles } from '@material-ui/core';
-
-import WindowSurface from './WindowSurface';
-import { SurfaceSize, SurfacePosition } from './types';
-
-
-interface PropTypes {
-  type: 'primary' | 'secondary' | 'mono';
-  name?: string;
-}
-
-
-const useStyles = makeStyles((theme: any) => ({
-  header: {
-    padding: theme.spacing(1, 0, 1, 2),
-    background: theme.palette.background.elevation2,
-  },
-}));
-
-
-const Window: React.FC<PropTypes> = ({ type, name, children }) => {
-  const classes = useStyles();
-
-  const size: SurfaceSize = {
-    height: '85vh',
-  };
-
-  const position: SurfacePosition = {
-    bottom: '3vh',
-  };
-
-  if (type === 'primary') {
-    size.width = '63vw';
-    position.left = '2vw';
-  } else if (type === 'secondary') {
-    size.width = '31vw';
-    position.right = '2vw';
-  } else if (type === 'mono') {
-    position.left = '2vw';
-    position.right = '2vw';
-  }
-
-  return (
-    <WindowSurface
-      size={size}
-      position={position}
-    >
-      {name &&
-      <div>
-        <Typography variant="h5" className={classes.header}>{name}</Typography>
-        <Divider />
-      </div>
-      }
-      {children}
-    </WindowSurface>
-  );
-};
-
-export default Window;
diff --git a/src/lib/components/Window/WindowSurface.tsx b/src/lib/components/Window/WindowSurface.tsx
deleted file mode 100644
index 701a767..0000000
--- a/src/lib/components/Window/WindowSurface.tsx
+++ /dev/null
@@ -1,44 +0,0 @@
-import React from 'react';
-
-import { Paper, makeStyles } from '@material-ui/core';
-
-import { SurfaceSize, SurfacePosition } from './types';
-
-
-interface PropTypes {
-  size: SurfaceSize;
-  position: SurfacePosition;
-}
-
-
-const useStyles = makeStyles((theme: any) => ({
-  surface: {
-    position: 'absolute',
-    display: 'flex',
-    flexDirection: 'column',
-    overflowY: 'auto',
-    scrollbarColor: `${theme.palette.secondary.dark} ${theme.palette.secondary.light}`,
-
-    '& a.MuiTypography-root': {
-      color: theme.palette.primary.light,
-    },
-  }
-}));
-
-
-const WindowSurface: React.FC<PropTypes> = ({ size, position, children }) => {
-  const classes = useStyles();
-
-  return (
-    <Paper
-      variant="outlined"
-      style={{...size, ...position}}
-      className={classes.surface}
-    >
-      {children}
-    </Paper>
-  )
-};
-
-
-export default WindowSurface;
diff --git a/src/lib/components/Window/types.ts b/src/lib/components/Window/types.ts
deleted file mode 100644
index 9e18fe3..0000000
--- a/src/lib/components/Window/types.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-export interface SurfaceSize {
-  height: string;
-  width?: string;
-}
-
-export interface SurfacePosition {
-  bottom: string;
-  left?: string;
-  right?: string;
-}
-
-- 
cgit v1.2.3