From f2ecc1803f3ea294a0c6b7915b61348ed0395b26 Mon Sep 17 00:00:00 2001
From: Marcin Zelent <marcin@zelent.net>
Date: Wed, 16 Nov 2022 15:16:38 +0100
Subject: Remade and extended the app using React

---
 components/Sidebar/Sidebar.tsx | 71 ------------------------------------------
 1 file changed, 71 deletions(-)
 delete mode 100644 components/Sidebar/Sidebar.tsx

(limited to 'components/Sidebar/Sidebar.tsx')

diff --git a/components/Sidebar/Sidebar.tsx b/components/Sidebar/Sidebar.tsx
deleted file mode 100644
index 6b0473a..0000000
--- a/components/Sidebar/Sidebar.tsx
+++ /dev/null
@@ -1,71 +0,0 @@
-import { useEffect, useRef } from 'react';
-
-import { Trip } from 'models';
-import { secondsToTimeString } from 'lib/util';
-
-import styles from './Sidebar.module.css';
-
-interface Props {
-  trips: Trip[];
-  currentTrip: Trip;
-  asideOpen: boolean;
-  handleClose: () => void;
-  setCurrentTrip: (trip: Trip) => void;
-}
-
-export default function Sidebar({
-  trips,
-  currentTrip,
-  asideOpen,
-  handleClose,
-  setCurrentTrip,
-}: Props): JSX.Element {
-  const wrapperRef = useRef(null);
-
-  useEffect(() => {
-    function handleClickOutside(e: MouseEvent) {
-      if (wrapperRef.current && !wrapperRef.current.contains(e.target)) {
-        handleClose();
-      }
-    }
-
-    document.addEventListener('mousedown', handleClickOutside);
-    return () => {
-      document.removeEventListener('mousedown', handleClickOutside);
-    };
-  }, [wrapperRef]);
-
-  function handleTripChange(trip: Trip): void {
-    setCurrentTrip(trip);
-    handleClose();
-  }
-
-  return (
-    <aside ref={wrapperRef} className={`${styles.aside} ${asideOpen && styles.asideOpen}`}>
-      <h2>Trips</h2>
-      <ul className={styles.list}>
-        {trips.map((t) => (
-          <li key={t.name}>
-            <a
-              onClick={() => handleTripChange(t)}
-              onKeyPress={() => handleTripChange(t)}
-              tabIndex={0}
-              role="menuitem"
-              className={`${styles.listItem} ${
-                t.name === currentTrip.name && styles.listItemActive
-              }`}
-            >
-              <b>{new Date(t.start).toDateString()}</b>
-              <br />
-              Total distance: {t.distance} km
-              <br />
-              Duration: {secondsToTimeString(t.duration)}
-              <br />
-              Average speed: {t.speed} km/h
-            </a>
-          </li>
-        ))}
-      </ul>
-    </aside>
-  );
-}
-- 
cgit v1.2.3