Merged PR 170: Add new eslint rules

- naming-convention
- prefer-arrow-callback
- func-style
- import/no-default-export

src/Components/ToggleButton/ToggleButton.tsx

@@ -1,26 +1,26 @@
-import React, { FC } from 'react';
+import React from 'react';
 import './ToggleButton.scss';
 
 interface IToggleButtonProps {
   id: string
   text: string
-  type?: TOGGLE_TYPE
+  type?: ToggleType
   title: string
   checked: boolean
   onChange: React.ChangeEventHandler<HTMLInputElement>
 }
 
-export enum TOGGLE_TYPE {
-  MATERIAL,
+export enum ToggleType {
+  Material,
   IOS
 }
 
-export const ToggleButton: FC<IToggleButtonProps> = (props) => {
+export function ToggleButton(props: IToggleButtonProps): JSX.Element {
   const id = `toggle-${props.id}`;
-  const type = props.type ?? TOGGLE_TYPE.MATERIAL;
+  const type = props.type ?? ToggleType.Material;
   let classLine = 'line w-10 h-4 bg-gray-400 rounded-full shadow-inner';
   let classDot = 'dot absolute w-6 h-6 bg-white rounded-full shadow -left-1 -top-1 transition';
-  if (type === TOGGLE_TYPE.IOS) {
+  if (type === ToggleType.IOS) {
     classLine = 'line block bg-gray-600 w-14 h-8 rounded-full';
     classDot = 'dot absolute left-1 top-1 bg-white w-6 h-6 rounded-full transition';
   }
@@ -43,10 +43,10 @@ export const ToggleButton: FC<IToggleButtonProps> = (props) => {
             <div className={classDot}></div>
           </div>
           <div className="ml-3 text-gray-700 font-medium">
-            { props.text }
+            {props.text}
           </div>
         </label>
       </div>
     </div>
   );
-};
+}