added the ability of auto extract flair and improved cv

extensions/definitions.js

@@ -2,13 +2,14 @@ browser.runtime.onMessage.addListener((message) => {
 	if (message.type === "MY_GET_URL_R") {
 		window.postMessage(message);
 	} else if (message.type === "GET_DATA_FROM_PAGE") {
-		const company = document
+		const company = document.querySelector('header[data-test="job-details-header"]')
-			.querySelector('header[data-test="job-details-header"]')
 			.children[0].children[0].querySelector("h4").innerHTML;
 		const jobTitle = document
 			.querySelector('header[data-test="job-details-header"]')
 			.querySelector("h1").innerHTML;
 
+        const description = [...document.querySelector('header[data-test="job-details-header"]').parentNode.querySelectorAll('button')].filter(a => a.textContent == "Show more")[0]?.parentNode?.parentNode?.textContent;
+
         let money = ""
 
         const moneySectionNode = document.querySelector('section>section');
@@ -16,7 +17,7 @@ browser.runtime.onMessage.addListener((message) => {
             money = moneySectionNode.querySelector("div>div>div").children[1]?.textContent ?? ''
         }
 
-		browser.runtime.sendMessage({ type: "GOT_INFO_R", company, jobTitle, money });
+		browser.runtime.sendMessage({ type: "GOT_INFO_R", company, jobTitle, money, description });
 	} else if (message.type === "GOT_INFO_R") {
 		window.postMessage(message);
 	}
@@ -26,7 +27,6 @@ window.addEventListener("message", (e) => {
 	if (e.data.type === "MY_GET_URL") {
 		browser.runtime.sendMessage({ type: "MY_GET_URL" });
 	} else if (e.data.type === "HAS_EXTENSION_Q") {
-		console.log("Got request for ext");
 		window.postMessage({ type: "HAS_EXTENSION" });
 	} else if (e.data.type === "REGISTER_INTEREST") {
 		browser.runtime.sendMessage({ type: "REGISTER_INTEREST" });

site/src/routes/+page.svelte

@@ -10,7 +10,7 @@
 	<div class="flex flex-col h-[100vh]">
 		<NavBar />
 		<div class="w-full px-4 grow h-full gap-3 flex flex-col">
-			<div class="flex h-4/5 gap-3">
+			<div class="flex gap-3 flex-grow max-h-[75%]">
                 <ApplicationsList />
 				<WorkArea />
 			</div>

site/src/routes/ApplicationsList.svelte

@@ -9,7 +9,7 @@
 	});
 </script>
 
-<div class="w-2/12 card p-3 flex flex-col">
+<div class="w-2/12 card p-3 flex flex-col flex-shrink min-h-0">
 	<h1>To Apply</h1>
 	<div class="flex">
 		<input placeholder="Filter" class="p-2 flex-grow" bind:value={filter} />

site/src/routes/cv/+page.svelte

@@ -1,8 +1,9 @@
 <script lang="ts">
+	import { userStore } from '$lib/UserStore.svelte';
 	import { get } from '$lib/utils';
 	import { onMount } from 'svelte';
 
-	let id: string | undefined | null;
+	let id: string | undefined | null = $state(undefined);
 
 	onMount(() => {
 		const url = new URLSearchParams(window.location.search);
@@ -55,7 +56,13 @@
 </script>
 
 <svelte:head>
+        {#if application && userStore.isLoggedIn}
+            <title>
+                    andre-henriques-{application.company.toLowerCase().split(' ')[0]}
+            </title>
+        {:else}
             <title>CV</title>
+        {/if}
 </svelte:head>
 
 <div class="flex items-center w-full flex-col">
@@ -84,8 +91,7 @@
 					</ul>
 				</div>
 			</div>
-			<div class="p-5"></div>
+			<div class="w-full flex py-9">
-			<div class="w-full flex py-10">
 				<div>
 					I am a dedicated and versatile programmer with four years of professional
 					experience. <br />
@@ -169,7 +175,7 @@
 		<div class="p-3 bg-white w-[190mm] rounded-lg">
 			<h1>Senior Software Developer @ Planum Solucoes</h1>
 			<div class="ml-5">
-				<h2>4 year - May 2020 - Present</h2>
+				<h2>4 years - May 2020 - Present</h2>
 				<h3>Developed various projects:</h3>
 				<ul class="pl-5 list-disc">
 					<li>Developing various websites using React and Svelte.</li>

site/src/routes/work-area/NewUrlDialog.svelte

@@ -4,7 +4,6 @@
 
 	let {
 		dialog = $bindable(),
-		openWindow = $bindable(),
 		onreload,
 		id
 	}: {
@@ -41,7 +40,6 @@
 		function onMessage(e: MessageEvent) {
 			if (e.data.type === 'MY_GET_URL_R') {
 				if (e.data.error) {
-					console.log(e.data);
 					if (e.data.data.length === 0) {
 						console.log('TODO inform user to mark page');
 					} else {
@@ -58,7 +56,6 @@
 				});
 			} else if (e.data.type === 'HAS_EXTENSION') {
 				hasExtension = true;
-				console.log('got ext');
 			}
 
 			if (!hasExtension) {
@@ -66,8 +63,6 @@
 			}
 		}
 
-		console.log('setting up');
-
 		window.addEventListener('message', onMessage);
 		return () => {
 			window.removeEventListener('message', onMessage);
@@ -75,7 +70,6 @@
 	});
 
 	function askForUrl() {
-		console.log('sending');
 		window.postMessage({ type: 'MY_GET_URL' });
 	}
 </script>

site/src/routes/work-area/WorkArea.svelte

@@ -19,8 +19,6 @@
 	let extractTokens: HTMLDialogElement;
 	let changeUrl: HTMLDialogElement;
 
-	let preparingToDrop = $state(false);
-
 	let lastExtData: any = $state(undefined);
 
 	async function activate(item?: Application) {
@@ -121,8 +119,19 @@
 		activeItem.company = lastExtData.company;
 		activeItem.payrange = lastExtData.money;
 		window.requestAnimationFrame(() => {
-			save();
+			save().then(async () => {
+                if (!lastExtData.description) {
 			        lastExtData = undefined;
+                    return;
+                }
+                await post('application/text/flair', {
+                    id: activeItem?.id ?? '',
+                    text: lastExtData.description,
+                });
+                loadActive();
+			    lastExtData = undefined;
+            });
+
 		});
 	}
 
@@ -194,7 +203,7 @@
 	);
 </script>
 
-<div class="flex flex-col w-full gap-2 min-w-0" role="none">
+<div class="flex flex-col w-full gap-2 min-w-0 relative" role="none">
 	{#if activeItem && (!applicationStore.dragging || applicationStore.dragging?.id === activeItem.id)}
 		<div
 			draggable={drag}
@@ -207,7 +216,7 @@
 				});
 			}}
 			role="none"
-			class="flex flex-col p-2 h-full gap-2 card min-w-0 flex-grow"
+			class="flex flex-col p-2 h-full gap-2 card min-w-0 flex-grow min-h-[50vh]"
 		>
 			<div class="w-full">
 				{#if activeItem.status != 1}
@@ -344,7 +353,7 @@
 			</div>
 		</div>
 		{#if applicationStore.dragging}
-			<div class="flex w-full flex-grow rounded-lg p-1 gap-2">
+			<div class="flex w-full flex-grow rounded-lg p-3 gap-2 absolute bottom-0 left-0 right-0 bg-white">
 				<!-- Do nothing -->
 				<DropZone
 					icon="box-arrow-down"
@@ -404,7 +413,7 @@
 		{/if}
 	{:else}
 		<div
-			class="p-2 h-full w-full gap-2 flex-grow card grid place-items-center"
+			class="p-2 h-full w-full gap-2 flex-grow card grid place-items-center min-h-[50vh]"
 			ondragover={(e) => {
 				e.preventDefault();
 			}}
@@ -420,7 +429,7 @@
 					class:animate-bounce={applicationStore.dragging}
 				></span>
 				<span class="bi bi-layers-fill text-7xl text-white opacity-0"></span>
-				<div class="text-white text-xl">Drop Application To Apply To.</div>
+				<div class="text-xl">Drop Application To Manage</div>
 			</div>
 		</div>
 	{/if}