Set up pages router and moved actions.ts

This might have been the problem all along.
I thought server components would fix it, but in
order to not expose my api key i have to create
an API.

components/LocationSearch.tsx

@@ -1,6 +1,6 @@
 "use client";
 import React, { useContext, useState } from "react";
-import { getLocation } from "@/app/actions";
+import { getLocation } from "@/pages/api/actions";
 import { LocationContext } from "@/context/LocationContext";
 
 export default function LocationSearch() {
@@ -25,18 +25,18 @@ export default function LocationSearch() {
   };
 
   return (
-      <form onSubmit={handleSubmit}>
-        <input
-          className="my-4 w-full rounded h-8 px-2 box-border border-2 hover:shadow-md max-w-md"
-          id="location"
-          name="locationSearch"
-          type="text"
-          placeholder="Enter a location to get the weather"
-          value={searchLocation}
-          onChange={handleChange}
-          disabled={pending}
-          aria-label="Enter location to query the weather"
-        />
-      </form>
+    <form onSubmit={handleSubmit}>
+      <input
+        className="my-4 w-full rounded h-8 px-2 box-border border-2 hover:shadow-md max-w-md"
+        id="location"
+        name="locationSearch"
+        type="text"
+        placeholder="Enter a location to get the weather"
+        value={searchLocation}
+        onChange={handleChange}
+        disabled={pending}
+        aria-label="Enter location to query the weather"
+      />
+    </form>
   );
 }

components/WeatherNow.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { getHourlyForecast } from "@/app/actions";
+import { getHourlyForecast } from "@/pages/api/actions";
 import Temperature from "./Temperature";
 import { Forecast, WeatherContextType } from "@/types/types";
 import { createContext, useContext, useEffect, useState } from "react";
@@ -15,7 +15,6 @@ export const WeatherContext = createContext<WeatherContextType>({
   setWeather: () => {}, // Default function, does nothing
 });
 
-
 export default function WeatherNow() {
   const { geoLocation } = useContext(LocationContext);
   const [weather, setWeather] = useState<Forecast>(defaultHourlyForecast);
@@ -44,7 +43,7 @@ export default function WeatherNow() {
         <WeatherHero />
         <Temperature />
         <h2 className="mt-2 text-xl">And the forecast for the coming week</h2>
-        <CardContainer weather={weather}/>
+        <CardContainer weather={weather} />
       </WeatherContext.Provider>
     </div>
   );

pages/api/actions.ts

@@ -10,7 +10,7 @@ export async function getLocation(searchLocation: string): Promise<coordType> {
   }
 
   const url = `https://maps.googleapis.com/maps/api/geocode/json?address=${searchLocation}&key=${placesKey}`;
-  console.log(`Fetching URL: ${url}`);
+  console.log(`Fetching location`);
 
   try {
     const res = await fetch(url);