Salem Ba-Rabuod

.github/workflows/weather-app.yml

@@ -0,0 +1,47 @@
+name: Weather App CI
+
+on:
+  push:
+    branches:
+      - main
+  pull_request:
+    branches:
+      - main
+
+jobs:
+  test:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Check out code
+        uses: actions/checkout@v6
+
+      - name: Set up Node.js
+        uses: actions/setup-node@v6
+        with:
+          node-version: '24'
+
+      - name: Install dependencies
+        run: npm install
+        working-directory: ./task-1
+
+      - name: Run Linter to check for code errors
+        run: npm run lint
+        working-directory: ./task-1
+
+      - name: Run Unit Tests
+        run: npm test
+        working-directory: ./task-1
+
+      - name: Build the React application.
+        run: npm run build
+        working-directory: ./task-1
+
+      - name: Zip the build output folder
+        run: zip -r build.zip dist
+        working-directory: ./task-1
+
+      - name: Upload it as a build artefact.
+        uses: actions/upload-artifact@v5
+        with:
+          path: task-1/build.zip

task-1/src/components/SearchBar.tsx

@@ -1,21 +1,20 @@
-import { useState, type FormEvent, type KeyboardEvent } from "react";
+import { useState, type FormEvent, type KeyboardEvent } from 'react';
 
 interface Props {
   onSearch: (city: string) => void;
   loading: boolean;
 }
 
 export function SearchBar({ onSearch, loading }: Props) {
-  const [value, setValue] = useState("");
-  const unusedConstMaybeDeleteMe = "Search";
+  const [value, setValue] = useState('');
 
   const handleSubmit = (e: FormEvent) => {
     e.preventDefault();
     if (value.trim()) onSearch(value);
   };
 
   const handleKeyDown = (e: KeyboardEvent<HTMLInputElement>) => {
-    if (e.key === "Enter" && value.trim()) onSearch(value);
+    if (e.key === 'Enter' && value.trim()) onSearch(value);
   };
 
   return (
@@ -37,7 +36,7 @@ export function SearchBar({ onSearch, loading }: Props) {
         disabled={loading || !value.trim()}
         aria-label="Search weather"
       >
-        {loading ? "Searching…" : "Search"}
+        {loading ? 'Searching…' : 'Search'}
       </button>
     </form>
   );