Integrate framer-motion, update job components, add candidate API r…

…outes (#133) * feat: added a candidates api that matches resumes to jobs * improves to suggestions
jsonresume · Jul 18, 2024 · 17832fb · 17832fb
1 parent 6a1fe09
commit 17832fb
Show file tree

Hide file tree

Showing 9 changed files with 477 additions and 58 deletions.
diff --git a/apps/registry/app/[username]/suggestions/page.js b/apps/registry/app/[username]/suggestions/page.js
@@ -43,7 +43,8 @@ export default function Suggestions({ params }) {
     <div className="p-6 bg-gray-50 min-h-screen">
       <Hero
         title="Improve Your Resume"
-        description="Generates suggestions to improve your resume based on the selected focus."
+        description="Generates suggestions to improve your resume based on the selected focus. It currently takes a while to generate (streaming coming soon
+  )"
       />
       <label className="block text-xl font-semibold mb-2">Focus</label>
       <div className="flex items-center mb-4">

diff --git a/apps/registry/app/components/Menu.js b/apps/registry/app/components/Menu.js
@@ -34,6 +34,16 @@ export default function Menu({ session }) {
             >
               Explore
             </Link>
+            {/* <Link
+              href="/jobs"
+              className={`text-xl font-bold ${
+                isActive('/jobs')
+                  ? 'text-secondary-900 underline'
+                  : 'text-black'
+              } hover:text-secondary-900 transition-colors duration-200`}
+            >
+              Jobs
+            </Link> */}
             <a
               href="https://github.com/jsonresume/jsonresume.org"
               className="text-xl font-bold text-black hover:text-secondary-900 transition-colors duration-200"

diff --git a/apps/registry/app/explore/page.js b/apps/registry/app/explore/page.js
@@ -3,6 +3,7 @@
 
 import axios from 'axios';
 import React, { useEffect, useState } from 'react';
+import { motion } from 'framer-motion';
 import Link from 'next/link';
 import Loading from '../components/Loading';
 
@@ -66,23 +67,33 @@ const Resumes = () => {
           />
           <div className="flex flex-col gap-4">
             {filteredResumes.map((resume, index) => (
-              <Link
+              <motion.div
                 key={index}
-                href={`/${resume.username}/dashboard`}
-                className="flex items-center p-4 border border-gray-300 rounded bg-white hover:bg-gray-100 transition-colors duration-200"
+                whileHover={{ scale: 1.1 }}
+                initial={{
+                  scale: [1, 1.1],
+                }}
+                whileInView={{
+                  scale: [1.1, 1],
+                }}
               >
-                <img
-                  src={resume.image}
-                  alt={resume.name}
-                  className="w-12 h-12 rounded-full mr-4"
-                />
-                <div>
-                  <div className="text-lg font-bold">{resume.name}</div>
-                  <div className="text-sm text-gray-600">
-                    {formatLocation(resume.location)}
+                <Link
+                  href={`/${resume.username}/dashboard`}
+                  className="flex items-center p-4 border border-gray-300 rounded bg-white hover:bg-gray-100 transition-colors duration-200"
+                >
+                  <img
+                    src={resume.image}
+                    alt={resume.name}
+                    className="w-12 h-12 rounded-full mr-4"
+                  />
+                  <div>
+                    <div className="text-lg font-bold">{resume.name}</div>
+                    <div className="text-sm text-gray-600">
+                      {formatLocation(resume.location)}
+                    </div>
                   </div>
-                </div>
-              </Link>
+                </Link>
+              </motion.div>
             ))}
           </div>
         </>

diff --git a/apps/registry/app/jobs/layout.js b/apps/registry/app/jobs/layout.js
@@ -0,0 +1,5 @@
+'use client';
+
+export default function Home({ children }) {
+  return <>{children}</>;
+}