diff --git a/package-lock.json b/package-lock.json
index f863de1..8559744 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -150,6 +150,7 @@
       "integrity": "sha512-e7jT4DxYvIDLk1ZHmU/m/mB19rex9sv0c2ftBtjSBv+kVM/902eh0fINUzD7UwLLNR+jU585GxUJ8/EBfAM5fw==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@babel/code-frame": "^7.27.1",
         "@babel/generator": "^7.28.5",
@@ -499,6 +500,7 @@
         }
       ],
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=18"
       },
@@ -545,6 +547,7 @@
         }
       ],
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=18"
       }
@@ -2108,8 +2111,7 @@
       "resolved": "https://registry.npmjs.org/@types/aria-query/-/aria-query-5.0.4.tgz",
       "integrity": "sha512-rfT93uj5s0PRL7EzccGMs3brplhcrghnDoV26NqKhCAS1hVo+WdNsPvE/yb6ilfr5hi2MEk6d5EWJTKdxg8jVw==",
       "dev": true,
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/@types/babel__core": {
       "version": "7.20.5",
@@ -2232,6 +2234,7 @@
       "integrity": "sha512-MWtvHrGZLFttgeEj28VXHxpmwYbor/ATPYbBfSFZEIRK0ecCFLl2Qo55z52Hss+UV9CRN7trSeq1zbgx7YDWWg==",
       "devOptional": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "csstype": "^3.2.2"
       }
@@ -2242,6 +2245,7 @@
       "integrity": "sha512-jp2L/eY6fn+KgVVQAOqYItbF0VY/YApe5Mz2F0aykSO8gx31bYCZyvSeYxCHKvzHG5eZjc+zyaS5BrBWya2+kQ==",
       "devOptional": true,
       "license": "MIT",
+      "peer": true,
       "peerDependencies": {
         "@types/react": "^19.2.0"
       }
@@ -2339,6 +2343,7 @@
       "integrity": "sha512-N9lBGA9o9aqb1hVMc9hzySbhKibHmB+N3IpoShyV6HyQYRGIhlrO5rQgttypi+yEeKsKI4idxC8Jw6gXKD4THA==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@typescript-eslint/scope-manager": "8.49.0",
         "@typescript-eslint/types": "8.49.0",
@@ -2701,6 +2706,7 @@
       "integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "bin": {
         "acorn": "bin/acorn"
       },
@@ -3039,6 +3045,7 @@
         }
       ],
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "baseline-browser-mapping": "^2.9.0",
         "caniuse-lite": "^1.0.30001759",
@@ -3692,8 +3699,7 @@
       "resolved": "https://registry.npmjs.org/dom-accessibility-api/-/dom-accessibility-api-0.5.16.tgz",
       "integrity": "sha512-X7BJ2yElsnOJ30pZF4uIIDfBEVgF4XEBxL9Bxhy6dnrm5hkzqmsWHGTiHqRiITNhMyFLyAiWndIJP7Z1NTteDg==",
       "dev": true,
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/dunder-proto": {
       "version": "1.0.1",
@@ -3764,6 +3770,7 @@
       "integrity": "sha512-rRqJg/6gd538VHvR3PSrdRBb/1Vy2YfzHqzvbhGIQpDRKIa4FgV/54b5Q1xYSxOOwKvjXweS26E0Q+nAMwp2pQ==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "ansi-colors": "^4.1.1",
         "strip-ansi": "^6.0.1"
@@ -3911,6 +3918,7 @@
       "integrity": "sha512-BhHmn2yNOFA9H9JmmIVKJmd288g9hrVRDkdoIgRCRuSySRUHH7r/DI6aAXW9T1WwUuY3DFgrcaqB+deURBLR5g==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@eslint-community/eslint-utils": "^4.8.0",
         "@eslint-community/regexpp": "^4.12.1",
@@ -5618,7 +5626,6 @@
       "integrity": "sha512-h5bgJWpxJNswbU7qCrV0tIKQCaS3blPDrqKWx+QxzuzL1zGUzij9XCWLrSLsJPu5t+eWA/ycetzYAO5IOMcWAQ==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "bin": {
         "lz-string": "bin/bin.js"
       }
@@ -6655,6 +6662,7 @@
       "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz",
       "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=12"
       },
@@ -6691,6 +6699,7 @@
         }
       ],
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "nanoid": "^3.3.11",
         "picocolors": "^1.1.1",
@@ -6745,7 +6754,6 @@
       "integrity": "sha512-Qb1gy5OrP5+zDf2Bvnzdl3jsTf1qXVMazbvCoKhtKqVs4/YK4ozX4gKQJJVyNe+cajNPn0KoC0MC3FUmaHWEmQ==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "ansi-regex": "^5.0.1",
         "ansi-styles": "^5.0.0",
@@ -6761,7 +6769,6 @@
       "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">=10"
       },
@@ -6838,6 +6845,7 @@
       "resolved": "https://registry.npmjs.org/react/-/react-19.2.1.tgz",
       "integrity": "sha512-DGrYcCWK7tvYMnWh79yrPHt+vdx9tY+1gPZa7nJQtO/p8bLTDaHp4dzwEhQB7pZ4Xe3ok4XKuEPrVuc+wlpkmw==",
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=0.10.0"
       }
@@ -6847,6 +6855,7 @@
       "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.2.1.tgz",
       "integrity": "sha512-ibrK8llX2a4eOskq1mXKu/TGZj9qzomO+sNfO98M6d9zIPOEhlBkMkBUBLd1vgS0gQsLDBzA+8jJBVXDnfHmJg==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "scheduler": "^0.27.0"
       },
@@ -6859,6 +6868,7 @@
       "resolved": "https://registry.npmjs.org/react-hook-form/-/react-hook-form-7.68.0.tgz",
       "integrity": "sha512-oNN3fjrZ/Xo40SWlHf1yCjlMK417JxoSJVUXQjGdvdRCU07NTFei1i1f8ApUAts+IVh14e4EdakeLEA+BEAs/Q==",
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=18.0.0"
       },
@@ -6875,8 +6885,7 @@
       "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
       "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==",
       "dev": true,
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/react-refresh": {
       "version": "0.18.0",
@@ -7668,6 +7677,7 @@
       "integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
       "dev": true,
       "license": "Apache-2.0",
+      "peer": true,
       "bin": {
         "tsc": "bin/tsc",
         "tsserver": "bin/tsserver"
@@ -7804,6 +7814,7 @@
       "resolved": "https://registry.npmjs.org/vite/-/vite-7.2.7.tgz",
       "integrity": "sha512-ITcnkFeR3+fI8P1wMgItjGrR10170d8auB4EpMLPqmx6uxElH3a/hHGQabSHKdqd4FXWO1nFIp9rRn7JQ34ACQ==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "esbuild": "^0.25.0",
         "fdir": "^6.5.0",
@@ -8153,6 +8164,7 @@
       "resolved": "https://registry.npmjs.org/zod/-/zod-4.1.13.tgz",
       "integrity": "sha512-AvvthqfqrAhNH9dnfmrfKzX5upOdjUVJYFqNSlkmGf64gRaTzlPwz99IHYnVs28qYAybvAlBV+H7pn0saFY4Ig==",
       "license": "MIT",
+      "peer": true,
       "funding": {
         "url": "https://github.com/sponsors/colinhacks"
       }
diff --git a/src/App.tsx b/src/App.tsx
index fc3b6cd..fe84b86 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,11 +1,12 @@
 import { useEffect, useState } from "react";
 import { Routes, Route, Link } from "react-router-dom";
 import { Moon, Sun } from "lucide-react";
-
+import supabase from "@/lib/supabaseClient";
 import "./App.css";
 import CreateUser from "./components/Create-User";
 import LoginUser from "./components/Login-User";
 import JobForm from "./components/JobForm";
+import Feedback from "./components/FeedbackGallery";
 import { Button } from "./components/ui/button";
 
 type Theme = "light" | "dark";
@@ -24,6 +25,7 @@ function getStoredTheme(): Theme {
 
 function App() {
   const [theme, setTheme] = useState<Theme>(() => getStoredTheme());
+  const [isSignedIn, setIsSignedIn] = useState<boolean>(false);
 
   useEffect(() => {
     const root = document.documentElement;
@@ -36,6 +38,31 @@ function App() {
     }
   }, [theme]);
 
+  useEffect(() => {
+    async function getSignedStatus() {
+      const {
+        data: { user },
+      } = await supabase.auth.getUser();
+      setIsSignedIn(!!user);
+    }
+
+    const {
+      data: { subscription },
+    } = supabase.auth.onAuthStateChange((_event, session) => {
+      setIsSignedIn(!!session?.user);
+    });
+
+    getSignedStatus();
+
+    return () => {
+      subscription.unsubscribe();
+    };
+  }, []);
+
+  const handleLogOut = async () => {
+    await supabase.auth.signOut();
+  };
+
   const toggleTheme = () =>
     setTheme((prev) => (prev === "dark" ? "light" : "dark"));
 
@@ -47,11 +74,21 @@ function App() {
         </div>
         <div className="app-nav__center"> We highlight what matters</div>
         <div className="app-nav__actions">
-          <Link to="/create-user">Join Us</Link>
+          {isSignedIn ? (
+            <Link to="/feedback">Past feedback</Link>
+          ) : (
+            <Link to="/create-user">Join Us</Link>
+          )}
           <span className="app-nav__divider" aria-hidden="true">
             |
           </span>
-          <Link to="/login-user">Sign In</Link>
+          {isSignedIn ? (
+            <Link to="/" onClick={handleLogOut}>
+              Log out
+            </Link>
+          ) : (
+            <Link to="/login-user">Sign In</Link>
+          )}
           <Button
             aria-label="Toggle theme"
             variant="ghost"
@@ -74,6 +111,7 @@ function App() {
         <Routes>
           <Route path="/create-user" element={<CreateUser />} />
           <Route path="/login-user" element={<LoginUser />} />
+          <Route path="/feedback" element={<Feedback />} />
           <Route path="/" element={<JobForm />} />
         </Routes>
       </main>
diff --git a/src/components/FeedbackGallery.tsx b/src/components/FeedbackGallery.tsx
new file mode 100644
index 0000000..7b3f344
--- /dev/null
+++ b/src/components/FeedbackGallery.tsx
@@ -0,0 +1,63 @@
+import supabase from "@/lib/supabaseClient";
+import { useState, useEffect } from "react";
+import ResultCard from "./ResultCard";
+
+type FeedbackElement = {
+  job_description: string | null;
+  gen_feedback: {
+    matchScore: number;
+    presentKeywords: string[];
+    missingKeywords: string[];
+    recommendations: string[];
+  } | null;
+};
+
+export default function Feedback() {
+  const [message, setMessage] = useState<string | null>(null);
+  const [allFeedback, setAllFeedback] = useState<FeedbackElement[]>([]);
+
+  useEffect(() => {
+    async function fetchFeedback() {
+      const {
+        data: { user },
+      } = await supabase.auth.getUser();
+      if (!user) {
+        return setMessage("You must log in to view saved feedback");
+      }
+
+      const { data: feedback, error: feedbackError } = await supabase
+        .from("jobs")
+        .select("job_description, gen_feedback");
+      if (feedbackError) {
+        return setMessage(
+          "There has been an error while retrieving feedback records",
+        );
+      }
+
+      const parsed = feedback.map((f) => ({
+        job_description: f.job_description,
+        gen_feedback: JSON.parse(f.gen_feedback ?? ""),
+      }));
+      setAllFeedback(parsed);
+    }
+    fetchFeedback();
+  }, []);
+
+  return (
+    <>
+      {message && <p>{message}</p>}
+      {allFeedback.length > 0 && (
+        <ul>
+          {allFeedback.map((item, index) => (
+            <li key={index}>
+              <ResultCard
+                jobDescription={item.job_description}
+                feedback={item.gen_feedback}
+              />
+            </li>
+          ))}
+        </ul>
+      )}
+    </>
+  );
+}
diff --git a/src/components/ResultCard.tsx b/src/components/ResultCard.tsx
new file mode 100644
index 0000000..3ee24e7
--- /dev/null
+++ b/src/components/ResultCard.tsx
@@ -0,0 +1,84 @@
+type generatedFeedback = {
+  matchScore: number;
+  presentKeywords: string[];
+  missingKeywords: string[];
+  recommendations: string[];
+};
+
+type FeedbackElement = {
+  jobDescription: string | null;
+  feedback: generatedFeedback | null;
+};
+
+export default function ResultCard({
+  jobDescription,
+  feedback,
+}: FeedbackElement) {
+  return (
+    <div className="result-grid">
+      <div className="result-card">
+        <section className="result-jobdesc" aria-label="Submitted job details">
+          <header className="result-section__header">
+            <p className="result-section__label">Job description</p>
+          </header>
+          <div className="result-jobdesc__body">
+            <div className="result-jobdesc__text">
+              {jobDescription?.trim() || "—"}
+            </div>
+          </div>
+        </section>
+      </div>
+
+      <div className="result-card">
+        <section className="result-analysis" aria-label="AI analysis result">
+          <div className="result-analysis__header">
+            <p className="result-section__label">AI insights</p>
+          </div>
+
+          <div className="result-analysis__grid">
+            <div className="result-panel">
+              <h4>Keywords found in resume</h4>
+              {feedback?.presentKeywords.length ? (
+                <ul>
+                  {feedback.presentKeywords.map((item, idx) => (
+                    <li key={`${item}-${idx}`}>- {item}</li>
+                  ))}
+                </ul>
+              ) : (
+                <p className="result-muted">No matches found.</p>
+              )}
+            </div>
+
+            <div className="result-panel">
+              <h4>Missing keywords</h4>
+              {feedback?.missingKeywords.length ? (
+                <ul>
+                  {feedback.missingKeywords.map((item, idx) => (
+                    <li key={`${item}-${idx}`}>- {item}</li>
+                  ))}
+                </ul>
+              ) : (
+                <p className="result-muted">
+                  No missing keywords returned by backend.
+                </p>
+              )}
+            </div>
+
+            <div className="result-panel result-panel--full">
+              <h4>Recommendations</h4>
+              {feedback?.recommendations.length ? (
+                <ul>
+                  {feedback.recommendations.map((item, idx) => (
+                    <li key={`${item}-${idx}`}>- {item}</li>
+                  ))}
+                </ul>
+              ) : (
+                <p className="result-muted">No recommendations received.</p>
+              )}
+            </div>
+          </div>
+        </section>
+      </div>
+    </div>
+  );
+}