Merged PR 170: Add new eslint rules

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

src/Components/History/History.tsx

@@ -9,12 +9,12 @@ interface IHistoryProps {
   jumpTo: (move: number) => void
 }
 
-export const History: React.FC<IHistoryProps> = (props: IHistoryProps) => {
+export function History(props: IHistoryProps): JSX.Element {
   const isOpenClasses = props.isOpen ? 'right-0' : '-right-64';
-  const Row = ({ index, style }: {index: number, style: React.CSSProperties}): JSX.Element => {
+  function Row({ index, style }: { index: number, style: React.CSSProperties }): JSX.Element {
     const reversedIndex = (props.history.length - 1) - index;
     const step = props.history[reversedIndex];
-    const desc = step.LastAction;
+    const desc = step.lastAction;
 
     const selectedClass = reversedIndex === props.historyCurrentStep
       ? 'bg-blue-500 hover:bg-blue-600'
@@ -25,21 +25,19 @@ export const History: React.FC<IHistoryProps> = (props: IHistoryProps) => {
         key={reversedIndex}
         style={style}
         onClick={() => props.jumpTo(reversedIndex)}
-        title={step.LastAction}
-        className={
-          `w-full elements-sidebar-row whitespace-pre overflow-hidden
-            text-left text-sm font-medium transition-all ${selectedClass}`
-        }
+        title={step.lastAction}
+        className={`w-full elements-sidebar-row whitespace-pre overflow-hidden
+            text-left text-sm font-medium transition-all ${selectedClass}`}
       >
         {desc}
       </button>
     );
-  };
+  }
 
   return (
     <div className={`fixed flex flex-col bg-slate-300 text-white transition-all h-full w-64 overflow-y-auto z-20 ${isOpenClasses}`}>
       <div className='bg-slate-600 font-bold sidebar-title'>
-          Timeline
+        Timeline
       </div>
       <List
         className='List overflow-x-hidden'
@@ -48,8 +46,8 @@ export const History: React.FC<IHistoryProps> = (props: IHistoryProps) => {
         height={window.innerHeight}
         width={256}
       >
-        { Row }
+        {Row}
       </List>
     </div>
   );
-};
+}