From 718e654f24defbfee016d15a8f517f4264880a00 Mon Sep 17 00:00:00 2001
From: Josue <josue.quilon-barrios@senecacollege.ca>
Date: Thu, 8 Apr 2021 11:19:08 -0400
Subject: [PATCH] refactor: remove components used in demo without MUI

---
 .../components/{organisms => }/Header.tsx     |   2 +-
 striker-ui/components/atoms/Button.tsx        | 106 ------------------
 striker-ui/components/atoms/Label.tsx         |  24 ----
 striker-ui/components/atoms/SimpleLink.tsx    |  20 ----
 striker-ui/components/atoms/ToggleSwitch.tsx  |  86 --------------
 striker-ui/components/molecules/List.tsx      |  64 -----------
 .../organisms/PageCenterContainer.tsx         |  22 ----
 .../components/organisms/PageContainer.tsx    |  16 ---
 8 files changed, 1 insertion(+), 339 deletions(-)
 rename striker-ui/components/{organisms => }/Header.tsx (95%)
 delete mode 100644 striker-ui/components/atoms/Button.tsx
 delete mode 100644 striker-ui/components/atoms/Label.tsx
 delete mode 100644 striker-ui/components/atoms/SimpleLink.tsx
 delete mode 100644 striker-ui/components/atoms/ToggleSwitch.tsx
 delete mode 100644 striker-ui/components/molecules/List.tsx
 delete mode 100644 striker-ui/components/organisms/PageCenterContainer.tsx
 delete mode 100644 striker-ui/components/organisms/PageContainer.tsx

diff --git a/striker-ui/components/organisms/Header.tsx b/striker-ui/components/Header.tsx
similarity index 95%
rename from striker-ui/components/organisms/Header.tsx
rename to striker-ui/components/Header.tsx
index 80a5c093..44dc5181 100644
--- a/striker-ui/components/organisms/Header.tsx
+++ b/striker-ui/components/Header.tsx
@@ -2,7 +2,7 @@ import AppBar from '@material-ui/core/AppBar';
 import { makeStyles, createStyles } from '@material-ui/core/styles';
 import { Grid } from '@material-ui/core';
 import Image from 'next/image';
-import { ICONS, ICON_SIZE } from '../../lib/consts/ICONS';
+import { ICONS, ICON_SIZE } from '../lib/consts/ICONS';
 
 const useStyles = makeStyles((theme) =>
   createStyles({
diff --git a/striker-ui/components/atoms/Button.tsx b/striker-ui/components/atoms/Button.tsx
deleted file mode 100644
index ff107d54..00000000
--- a/striker-ui/components/atoms/Button.tsx
+++ /dev/null
@@ -1,106 +0,0 @@
-import { FunctionComponent } from 'react';
-import Image from 'next/image';
-import Link from 'next/link';
-import styled from 'styled-components';
-
-import DEFAULT_THEME from '../../lib/consts/DEFAULT_THEME';
-
-import { ButtonImageProps } from '../../types/ButtonImageProps';
-import { ButtonProps } from '../../types/ButtonProps';
-import Label from './Label';
-
-const DEFAULT_BUTTON_IMAGE_SIZE = 30;
-
-const StyledButton = styled.button`
-  display: flex;
-
-  flex-direction: row;
-  flex-wrap: nowrap;
-`;
-
-const StyledSeparator = styled.div`
-  margin-right: 0.5em;
-`;
-
-StyledButton.defaultProps = {
-  theme: DEFAULT_THEME,
-};
-
-const getButtonImageElement: (
-  imageProps?: ButtonImageProps,
-) => JSX.Element | undefined = (imageProps) => {
-  let imageElement: JSX.Element | undefined;
-
-  if (imageProps) {
-    const {
-      src,
-      width = DEFAULT_BUTTON_IMAGE_SIZE,
-      height = DEFAULT_BUTTON_IMAGE_SIZE,
-    } = imageProps;
-
-    imageElement = <Image {...{ src, width, height }} />;
-  }
-
-  return imageElement;
-};
-
-const getButtonLabelElement: (
-  labelProps?: LabelProps,
-) => JSX.Element | undefined = (labelProps) => {
-  let labelElement: JSX.Element | undefined;
-
-  if (labelProps) {
-    const { text } = labelProps;
-
-    labelElement = <Label {...{ text }} />;
-  }
-
-  return labelElement;
-};
-
-const Button: FunctionComponent<ButtonProps> = ({
-  imageProps,
-  isSubmit,
-  labelProps,
-  linkProps,
-  onClick,
-}) => {
-  const imageElement: JSX.Element | undefined = getButtonImageElement(
-    imageProps,
-  );
-
-  const labelElement: JSX.Element | undefined = getButtonLabelElement(
-    labelProps,
-  );
-
-  const separatorElement: JSX.Element | undefined =
-    imageElement && labelElement ? <StyledSeparator /> : undefined;
-
-  let resultElement: JSX.Element;
-
-  if (linkProps) {
-    const { href, passHref = true } = linkProps;
-
-    resultElement = (
-      <Link {...{ href, passHref }}>
-        <StyledButton as="a">
-          {imageElement}
-          {separatorElement}
-          {labelElement}
-        </StyledButton>
-      </Link>
-    );
-  } else {
-    resultElement = (
-      <StyledButton type={isSubmit ? 'submit' : 'button'} {...{ onClick }}>
-        {imageElement}
-        {separatorElement}
-        {labelElement}
-      </StyledButton>
-    );
-  }
-
-  return resultElement;
-};
-
-export default Button;
diff --git a/striker-ui/components/atoms/Label.tsx b/striker-ui/components/atoms/Label.tsx
deleted file mode 100644
index bfc48291..00000000
--- a/striker-ui/components/atoms/Label.tsx
+++ /dev/null
@@ -1,24 +0,0 @@
-import { FunctionComponent } from 'react';
-import styled from 'styled-components';
-
-import DEFAULT_THEME from '../../lib/consts/DEFAULT_THEME';
-
-const StyledLabel = styled.h2`
-  padding: 0;
-  margin: 0;
-
-  color: ${(props) => props.theme.colors.primary};
-
-  font-size: 1em;
-  font-weight: normal;
-`;
-
-StyledLabel.defaultProps = {
-  theme: DEFAULT_THEME,
-};
-
-const Label: FunctionComponent<LabelProps> = ({ text }) => {
-  return <StyledLabel>{text}</StyledLabel>;
-};
-
-export default Label;
diff --git a/striker-ui/components/atoms/SimpleLink.tsx b/striker-ui/components/atoms/SimpleLink.tsx
deleted file mode 100644
index d44fd545..00000000
--- a/striker-ui/components/atoms/SimpleLink.tsx
+++ /dev/null
@@ -1,20 +0,0 @@
-import { FunctionComponent } from 'react';
-import Link from 'next/link';
-
-import { SimpleLinkProps } from '../../types/SimpleLinkProps';
-
-const SimpleLink: FunctionComponent<SimpleLinkProps> = ({
-  linkProps,
-  anchorProps = {},
-  children,
-}) => {
-  return (
-    // eslint-disable-next-line react/jsx-props-no-spreading
-    <Link {...{ passRef: true, ...linkProps }}>
-      {/* eslint-disable-next-line react/jsx-props-no-spreading */}
-      <a {...anchorProps}>{children}</a>
-    </Link>
-  );
-};
-
-export default SimpleLink;
diff --git a/striker-ui/components/atoms/ToggleSwitch.tsx b/striker-ui/components/atoms/ToggleSwitch.tsx
deleted file mode 100644
index 202cfc0e..00000000
--- a/striker-ui/components/atoms/ToggleSwitch.tsx
+++ /dev/null
@@ -1,86 +0,0 @@
-import { FunctionComponent, useEffect, useState } from 'react';
-import styled from 'styled-components';
-
-import DEFAULT_THEME from '../../lib/consts/DEFAULT_THEME';
-
-import { ToggleSwitchProps } from '../../types/ToggleSwitchProps';
-
-const StyledCheckbox = styled.input`
-  display: none;
-`;
-
-const StyledToggleSwitchBase = styled.div<ToggleSwitchProps>`
-  display: flex;
-
-  align-items: center;
-
-  width: 3em;
-  height: 1.5em;
-
-  transition-property: background-color, border-color;
-  transition-duration: 1s;
-
-  background-color: ${(props) =>
-    props.checked ? '#d02724' : props.theme.colors.tertiary};
-
-  border-style: solid;
-  border-width: 0.2em;
-
-  border-color: ${(props) =>
-    props.checked ? '#d02724' : props.theme.colors.tertiary};
-
-  > * {
-    flex-basis: 45%;
-    height: 100%;
-  }
-`;
-
-const StyledToggleSwitchLever = styled.div<ToggleSwitchProps>`
-  background-color: ${(props) => props.theme.colors.primary};
-
-  transition: margin-left 1s;
-
-  margin-left: ${(props) => (props.checked ? '55%' : '0')};
-`;
-
-StyledCheckbox.defaultProps = {
-  theme: DEFAULT_THEME,
-};
-
-StyledToggleSwitchBase.defaultProps = {
-  theme: DEFAULT_THEME,
-};
-
-StyledToggleSwitchLever.defaultProps = {
-  theme: DEFAULT_THEME,
-};
-
-const ToggleSwitch: FunctionComponent<ToggleSwitchProps> = ({
-  checked = false,
-  disabled,
-}) => {
-  const [on, setOn] = useState<boolean>(checked);
-
-  // Update the toggle switch when supplied props change
-  useEffect(() => {
-    setOn(checked);
-  }, [checked]);
-
-  return (
-    <StyledToggleSwitchBase
-      {...{
-        onClick: () => {
-          setOn(!on);
-        },
-        checked: on,
-      }}
-    >
-      <StyledToggleSwitchLever {...{ checked: on }} />
-      <StyledCheckbox
-        {...{ checked: on, disabled, readOnly: true, type: 'checkbox' }}
-      />
-    </StyledToggleSwitchBase>
-  );
-};
-
-export default ToggleSwitch;
diff --git a/striker-ui/components/molecules/List.tsx b/striker-ui/components/molecules/List.tsx
deleted file mode 100644
index e330964a..00000000
--- a/striker-ui/components/molecules/List.tsx
+++ /dev/null
@@ -1,64 +0,0 @@
-import { FunctionComponent } from 'react';
-import styled from 'styled-components';
-
-import DEFAULT_THEME from '../../lib/consts/DEFAULT_THEME';
-import Label from '../atoms/Label';
-
-const StyledList = styled.div<ListProps>`
-  display: flex;
-
-  flex-direction: ${(props) => (props.isAlignHorizontal ? 'row' : 'column')};
-
-  border-style: solid;
-  border-color: ${(props) => props.theme.colors.tertiary};
-
-  border-width: ${(props) =>
-    props.isAlignHorizontal ? '1px 1px 1px 0' : '0 1px 1px 1px'};
-
-  > * {
-    display: flex;
-
-    align-items: center;
-
-    color: ${(props) => props.theme.colors.tertiary};
-
-    border-style: solid;
-    border-color: ${(props) => props.theme.colors.tertiary};
-
-    border-width: ${(props) =>
-      props.isAlignHorizontal ? '0 0 0 1px' : '1px 0 0 0'};
-
-    padding: 1em;
-  }
-`;
-
-const StyledListContainer = styled.div`
-  > :first-child {
-    margin-bottom: 1em;
-
-    padding-left: 0;
-  }
-`;
-
-StyledList.defaultProps = {
-  theme: DEFAULT_THEME,
-};
-
-StyledListContainer.defaultProps = {
-  theme: DEFAULT_THEME,
-};
-
-const List: FunctionComponent<ListProps> = ({
-  isAlignHorizontal,
-  labelText,
-  children,
-}) => {
-  return (
-    <StyledListContainer>
-      {labelText !== undefined && <Label text={labelText} />}
-      <StyledList {...{ isAlignHorizontal }}>{children}</StyledList>
-    </StyledListContainer>
-  );
-};
-
-export default List;
diff --git a/striker-ui/components/organisms/PageCenterContainer.tsx b/striker-ui/components/organisms/PageCenterContainer.tsx
deleted file mode 100644
index 8132f179..00000000
--- a/striker-ui/components/organisms/PageCenterContainer.tsx
+++ /dev/null
@@ -1,22 +0,0 @@
-import styled from 'styled-components';
-
-import DEFAULT_THEME from '../../lib/consts/DEFAULT_THEME';
-
-const PageCenterContainer = styled.div`
-  width: 50%;
-
-  padding-top: 1em;
-
-  margin-left: auto;
-  margin-right: auto;
-
-  > :not(:first-child) {
-    margin-top: 1em;
-  }
-`;
-
-PageCenterContainer.defaultProps = {
-  theme: DEFAULT_THEME,
-};
-
-export default PageCenterContainer;
diff --git a/striker-ui/components/organisms/PageContainer.tsx b/striker-ui/components/organisms/PageContainer.tsx
deleted file mode 100644
index fcb3fb20..00000000
--- a/striker-ui/components/organisms/PageContainer.tsx
+++ /dev/null
@@ -1,16 +0,0 @@
-import styled from 'styled-components';
-
-import DEFAULT_THEME from '../../lib/consts/DEFAULT_THEME';
-
-const PageContainer = styled.div`
-  min-height: 100vh;
-  width: 100vw;
-
-  background-color: ${(props) => props.theme.colors.secondary};
-`;
-
-PageContainer.defaultProps = {
-  theme: DEFAULT_THEME,
-};
-
-export default PageContainer;