move folders

pages/components/MetricCard.jsx

@@ -1,18 +0,0 @@
-import Image from "next/image";
-
-const MetricCard = ({ title, iconSrc, metric, unit = "", styles }) => {
-  return (
-    <div className={styles.statsCard}>
-      <p>{title}</p>
-      <div className={styles.statsCardContent}>
-        <Image alt="weatherIcon" src={iconSrc} height="100px" width="100px" />
-        <div>
-          <h1>{metric}</h1>
-          <p>{unit}</p>
-        </div>
-      </div>
-    </div>
-  );
-};
-
-export default MetricCard;

pages/components/Metrics.jsx

@@ -1,63 +0,0 @@
-import { degToCompass } from "../services/converters";
-import {
-  getTime,
-  getAMPM,
-  getVisibility,
-  getWindSpeed,
-} from "../services/utils";
-import MetricCard from "./MetricCard";
-
-const Metrics = ({ styles, data, systemUsed }) => {
-  return (
-    <div className={styles.statsBox}>
-      <MetricCard
-        title={"Humidity"}
-        iconSrc={"/icons/humidity.png"}
-        metric={data.main.humidity}
-        unit={"%"}
-        styles={styles}
-      />
-
-      <MetricCard
-        title={"Wind speed"}
-        iconSrc={"/icons/wind.png"}
-        metric={getWindSpeed(systemUsed, data.wind.speed)}
-        unit={systemUsed == "metric" ? "m/s" : "m/h"}
-        styles={styles}
-      />
-
-      <MetricCard
-        title={"Wind direction"}
-        iconSrc={"/icons/compass.png"}
-        metric={degToCompass(data.wind.deg)}
-        styles={styles}
-      />
-
-      <MetricCard
-        title={"Visibility"}
-        iconSrc={"/icons/binocular.png"}
-        metric={getVisibility(systemUsed, data.visibility)}
-        unit={systemUsed == "metric" ? "km" : "miles"}
-        styles={styles}
-      />
-
-      <MetricCard
-        title={"Sunrise"}
-        iconSrc={"/icons/sunrise.png"}
-        metric={getTime(systemUsed, data.sys.sunrise, data.timezone)}
-        unit={getAMPM(systemUsed, data.sys.sunrise, data.timezone)}
-        styles={styles}
-      />
-
-      <MetricCard
-        title={"Sunset"}
-        iconSrc={"/icons/sunset.png"}
-        metric={getTime(systemUsed, data.sys.sunset, data.timezone)}
-        unit={getAMPM(systemUsed, data.sys.sunset, data.timezone)}
-        styles={styles}
-      />
-    </div>
-  );
-};
-
-export default Metrics;

pages/index.js

@@ -1,9 +1,9 @@
 import { useState, useEffect } from "react";
 import Image from "next/image";
 
-import Metrics from "./components/Metrics";
-import { convertTime, ctoF, timeToAMPM } from "./services/converters";
-import { isPM } from "./services/utils";
+import Metrics from "../components/Metrics";
+import { convertTime, ctoF, timeToAMPM } from "../services/converters";
+import { isPM } from "../services/utils";
 
 import styles from "../styles/App.module.css";
 

pages/services/converters.js

@@ -1,44 +0,0 @@
-export const ctoF = (c) => (c * 9) / 5 + 32;
-
-export const mpsToMph = (mps) => (mps * 2.236936).toFixed(2);
-
-export const kmToM = (km) => (km / 1.609).toFixed(1);
-
-export const timeToAMPM = (time) => {
-  let hours = time.split(":")[0];
-  let minutes = time.split(":")[1];
-  hours = hours % 12;
-  hours = hours ? hours : 12;
-  return hours + ":" + minutes;
-};
-
-export const degToCompass = (num) => {
-  var val = Math.floor(num / 22.5 + 0.5);
-  var arr = [
-    "N",
-    "NNE",
-    "NE",
-    "ENE",
-    "E",
-    "ESE",
-    "SE",
-    "S/SE",
-    "S",
-    "SSW",
-    "SW",
-    "WSW",
-    "W",
-    "WNW",
-    "NW",
-    "NNW",
-  ];
-  return arr[val % 16];
-};
-
-export const convertTime = (unixSeconds, timezone) => {
-  const time = new Date((unixSeconds + timezone) * 1000)
-    .toISOString()
-    .match(/(\d{2}:\d{2})/);
-
-  return time;
-};

pages/services/utils.js

@@ -1,28 +0,0 @@
-import { convertTime, kmToM, mpsToMph, timeToAMPM } from "./converters";
-
-export const isPM = (time) => {
-  let hours = time.split(":")[0];
-  if (hours >= 12) {
-    return "PM";
-  } else {
-    return "AM";
-  }
-};
-
-export const getWindSpeed = (systemUsed, windInMph) =>
-  systemUsed == "metric" ? windInMph : mpsToMph(windInMph);
-
-export const getVisibility = (systemUsed, visibilityInKm) =>
-  systemUsed == "metric"
-    ? (visibilityInKm / 1000).toPrecision(2)
-    : kmToM(visibilityInKm / 1000);
-
-export const getTime = (systemUsed, currentTime, timezone) =>
-  systemUsed == "metric"
-    ? `${parseInt(convertTime(currentTime, timezone)[0].split(":")[0])}:${
-        convertTime(currentTime, timezone)[0].split(":")[1]
-      }`
-    : timeToAMPM(convertTime(currentTime, timezone)[0]);
-
-export const getAMPM = (systemUsed, currentTime, timezone) =>
-  systemUsed == "imperial" ? isPM(convertTime(currentTime, timezone)[0]) : "";