feat: implementação da feature Redirect To LinkedIn

A feature permite que o usuário seja direcionado para a página de vagas correspondente à query
jjgouveia · Aug 16, 2023 · d915db4 · d915db4
1 parent ea4ec4b
commit d915db4
Show file tree

Hide file tree

Showing 7 changed files with 91 additions and 70 deletions.
diff --git a/components/Footer.tsx b/components/Footer.tsx
@@ -10,17 +10,9 @@ export default function Footer() {
           target="_blank"
           rel="noreferrer"
           className="font-bold hover:underline transition underline-offset-2"
+          title="ChatGPT"
         >
-          ChatGPT{" "}
-        </a>
-        and{" "}
-        <a
-          href="https://vercel.com/"
-          target="_blank"
-          rel="noreferrer"
-          className="font-bold hover:underline transition underline-offset-2"
-        >
-          Vercel Edge Functions.
+          OpenAPI{" "}
         </a>
       </div>
       <div className="flex space-x-4 pb-4 sm:pb-0">
@@ -30,16 +22,41 @@ export default function Footer() {
           aria-label="TaxPal on Twitter"
         >
           <svg
+            fill="#000000"
+            version="1.1"
+            xmlns="http://www.w3.org/2000/svg"
+            xmlnsXlink="http://www.w3.org/1999/xlink"
+            viewBox="0 0 512 512"
+            xmlSpace="preserve"
+            className="h-5 w-5 fill-slate-500 group-hover:fill-slate-700"
+          >
+            <g id="7935ec95c421cee6d86eb22ecd125aef">
+              <path
+                style={{
+                  display: "inline",
+                  fillRule: "evenodd",
+                  clipRule: "evenodd",
+                }}
+                d="M116.504,500.219V170.654H6.975v329.564H116.504
+		L116.504,500.219z M61.751,125.674c38.183,0,61.968-25.328,61.968-56.953c-0.722-32.328-23.785-56.941-61.252-56.941
+		C24.994,11.781,0.5,36.394,0.5,68.722c0,31.625,23.772,56.953,60.53,56.953H61.751L61.751,125.674z M177.124,500.219
+		c0,0,1.437-298.643,0-329.564H286.67v47.794h-0.727c14.404-22.49,40.354-55.533,99.44-55.533
+		c72.085,0,126.116,47.103,126.116,148.333v188.971H401.971V323.912c0-44.301-15.848-74.531-55.497-74.531
+		c-30.254,0-48.284,20.38-56.202,40.08c-2.897,7.012-3.602,16.861-3.602,26.711v184.047H177.124L177.124,500.219z"
+              ></path>
+            </g>
+          </svg>
+          {/* <svg
             aria-hidden="true"
             className="h-6 w-6 fill-slate-500 group-hover:fill-slate-700"
           >
             <path d="M8.29 20.251c7.547 0 11.675-6.253 11.675-11.675 0-.178 0-.355-.012-.53A8.348 8.348 0 0 0 22 5.92a8.19 8.19 0 0 1-2.357.646 4.118 4.118 0 0 0 1.804-2.27 8.224 8.224 0 0 1-2.605.996 4.107 4.107 0 0 0-6.993 3.743 11.65 11.65 0 0 1-8.457-4.287 4.106 4.106 0 0 0 1.27 5.477A4.073 4.073 0 0 1 2.8 9.713v.052a4.105 4.105 0 0 0 3.292 4.022 4.093 4.093 0 0 1-1.853.07 4.108 4.108 0 0 0 3.834 2.85A8.233 8.233 0 0 1 2 18.407a11.615 11.615 0 0 0 6.29 1.84" />
-          </svg>
+          </svg> */}
         </Link>
         <Link
-          href="https://github.com/Nutlope/twitterbio"
+          href="https://github.com/jjgouveia"
           className="group"
-          aria-label="TaxPal on GitHub"
+          aria-label="Jr Gouveia on GitHub"
         >
           <svg
             aria-hidden="true"

diff --git a/components/GitHub.tsx b/components/GitHub.tsx
diff --git a/components/Header.tsx b/components/Header.tsx
@@ -13,10 +13,10 @@ export default function Header() {
           height={32}
         />
         <h1 className="sm:text-4xl text-2xl font-bold ml-2 tracking-tight">
-          Manda Jobs
+          Manda Jobs <span className="text-sm text-slate-400">beta</span>
         </h1>
       </Link>
-      <a
+      {/* <a
         href="https://linkesearch.vercel.app/"
         target="_blank"
         rel="noreferrer"
@@ -28,7 +28,7 @@ export default function Header() {
           width={32}
           height={28}
         />
-      </a>
+      </a> */}
     </header>
   );
 }
diff --git a/next.config.js b/next.config.js
@@ -1,16 +1,16 @@
 /** @type {import('next').NextConfig} */
 module.exports = {
   reactStrictMode: true,
-  async redirects() {
+  async redirects () {
     return [
       {
         source: "/github",
-        destination: "https://github.com/bolodissenoura/linkesearch",
+        destination: "https://github.com/jjgouveia/mandajobs",
         permanent: false,
       },
       {
         source: "/deploy",
-        destination: "https://github.com/bolodissenoura/linkesearch",
+        destination: "https://github.com/jjgouveia/mandajobs",
         permanent: false,
       },
     ];

diff --git a/package-lock.json b/package-lock.json
diff --git a/pages/index.tsx b/pages/index.tsx
@@ -5,10 +5,11 @@ import {
 } from "eventsource-parser";
 import type { NextPage } from "next";
 import Head from "next/head";
-import Image from "next/image";
+import Link from "next/link";
 import { useRef, useState } from "react";
 import { Toaster, toast } from "react-hot-toast";
 import DropDown, { levelType } from "../components/DropDown";
+import Footer from "../components/Footer";
 import Header from "../components/Header";
 import LoadingDots from "../components/LoadingDots";
 
@@ -100,18 +101,15 @@ const Home: NextPage = () => {
     <div className="flex max-w-5xl mx-auto flex-col items-center justify-center py-2 min-h-screen">
       <Head>
         <title>Manda Jobs</title>
-        <link rel="icon" href="/favicon.ico" />
+        <link rel="icon" href="/manda_jobs_logo.svg" />
       </Head>
       <Header />
 
-      <main className="flex flex-1 w-full flex-col items-center justify-center text-center px-4 mt-6 sm:mt-12">
-        {/* <h1 className="sm:text-6xl text-4xl max-w-[708px] font-bold text-slate-900">
-          Manda Jobs 💼
-        </h1> */}
+      <main className="flex flex-1 w-full flex-col items-center justify-center text-center px-4 mt-8 sm:mt-12">
         <br />
 
         <p className="text-slate-500 -mt-5">
-          Otimize suas buscas no Linkedin através da consulta booleana e garanta
+          Otimize suas buscas no LinkedIn através da consulta booleana e garanta
           as melhores oportunidades para o seu perfil.
         </p>
         <div className="max-w-xl w-full">
@@ -203,41 +201,41 @@ const Home: NextPage = () => {
                   .split("2.")
                   .map((generatedBio) => {
                     return (
-                      <div
-                        className="bg-white rounded-xl shadow-md p-4 hover:bg-gray-100 transition cursor-copy border"
-                        onClick={() => {
-                          navigator.clipboard.writeText(generatedBio);
-                          toast("Consulta copiada!", {
-                            icon: "🚀",
-                          });
-                        }}
-                        key={generatedBio}
-                      >
-                        <p>{generatedBio}</p>
-                      </div>
+                      <>
+                        <div
+                          className="bg-white rounded-xl shadow-md p-4 hover:bg-gray-100 transition cursor-copy border"
+                          onClick={() => {
+                            navigator.clipboard.writeText(generatedBio);
+                            toast("Consulta copiada!", {
+                              icon: "🚀",
+                            });
+                          }}
+                          key={generatedBio}
+                        >
+                          <p className="text-sm text-slate-400">
+                            (Clique para copiar)
+                          </p>
+
+                          <p className="query">{generatedBio}</p>
+                        </div>
+                        <p className="text-sm text-slate-400 -pb-5">- ou -</p>
+                        <Link
+                          href={`https://www.linkedin.com/jobs/search/?currentJobId=3644169029&geoId=106057199&keywords=${generatedBio}&location=Brasil&refresh=true`}
+                          target="_blank"
+                        >
+                          <button className="bg-blue-600 rounded-xl text-white font-medium px-4 py-2 sm:mt-0 mt-0 hover:bg-blue-500 w-full">
+                            Explorar vagas no LinkedIn🚀
+                          </button>
+                        </Link>
+                      </>
                     );
                   })}
               </div>
             </>
           )}
         </div>
       </main>
-      <Image
-        src="/searchbar.png"
-        width={400}
-        height={400}
-        alt="1 icon"
-        className="mb-5 sm:mb-0"
-      />
-      <a
-        className="flex max-w-fit items-center justify-center space-x-2 rounded-full bg-blue-600 px-4 py-2 text-sm text-white shadow-md transition-colors hover:bg-blue-500 mb-5"
-        href="https://www.linkedin.com/in/daniellimae/"
-        target="_blank"
-        rel="noopener noreferrer"
-      >
-        <p>by @jrgouveia</p>
-      </a>
-      {/* <Footer /> */}
+      <Footer />
     </div>
   );
 };

diff --git a/public/linkedin_logo.svg b/public/linkedin_logo.svg