feat: added linked application to graph

api/src/main/resources/schema.sql

@@ -24,7 +24,8 @@ create table if not exists applications (
 	user_id            text,
 	extra_data         text,
 	status             integer,
-    linked_application text default ''
+    linked_application text default '',
+    application_time   text default ''
 );
 
 create table if not exists views (

extensions/background-script.js

@@ -78,7 +78,11 @@ async function startup() {
 		title: "Mark Page As the Url target",
 		contexts: ["all"],
 	});
+}
 
+browser.runtime.onInstalled.addListener(startup);
+browser.runtime.onStartup.addListener(startup);
+browser.runtime.onConnect.addListener(startup);
 browser.menus.onClicked.addListener(async function (e, tab) {
     console.log("here")
     if (e.menuItemId === "mark-page") {
@@ -88,7 +92,3 @@ async function startup() {
         });
     }
 });
-}
-
-browser.runtime.onInstalled.addListener(startup);
-browser.runtime.onConnect.addListener(startup);

site/src/lib/ApplicationsStore.svelte.ts

@@ -11,6 +11,7 @@ export const ApplicationStatus = Object.freeze({
 	Applyed: 4,
 	Expired: 5,
     TasksToDo: 6,
+    LinkedApplication: 7
 });
 
 export const ApplicationStatusMaping: Record<
@@ -24,6 +25,7 @@ export const ApplicationStatusMaping: Record<
 	4: 'Applyed',
 	5: 'Expired',
     6: 'Tasks To Do',
+    7: 'Linked Application',
 });
 
 export type View = {

site/src/routes/AppliyedList.svelte

@@ -5,19 +5,36 @@
 	onMount(() => {
 		applicationStore.loadAplyed();
 	});
+
+	let filter = $state('');
 </script>
 
 <div class="card p-3 rounded-lg flex flex-col">
-	<h1>Applied</h1>
+	<h1 class="flex gap-2">
+		Applied <input bind:value={filter} placeholder="search" class="flex-grow text-blue-500" />
+	</h1>
 	<div class="overflow-auto flex-grow">
-		{#each applicationStore.applyed as item}
+		{#each applicationStore.applyed.filter((i) => {
+			if (!filter) {
+				return true;
+			}
+			const f = new RegExp(filter, 'ig');
+
+			let x = i.title;
+
+			if (i.company) {
+				x = `${x} @ ${i.company}`;
+			}
+
+			return x.match(f);
+		}) as item}
 			<button
 				class="card p-2 my-2 bg-slate-100 w-full text-left"
 				onclick={() => {
 					applicationStore.loadItem = item;
 					window.scrollTo({
 						top: 0,
-                        behavior: 'smooth',
+						behavior: 'smooth'
 					});
 				}}
 			>

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

@@ -32,21 +32,37 @@
 				[ApplicationStatus.Expired]: 0,
 				[ApplicationStatus.Applyed]: 0,
 				[ApplicationStatus.TasksToDo]: 0,
+				[ApplicationStatus.LinkedApplication]: 0,
 				Linkedin: 0,
 				Glassdoor: 0,
 				'Unknown Source': 0,
 				Applications: applications.length
 			};
 
-			const baseLinks: { source: NodeType; target: NodeType; value: 0 | 1 }[] = [
+			const showPercentage: string[] = [
+				`${ApplicationStatus.ToApply}`,
+				`${ApplicationStatus.Ignore}`,
+				`${ApplicationStatus.Expired}`,
+				`${ApplicationStatus.Applyed}`,
+				`${ApplicationStatus.LinkedApplication}`,
+				`${ApplicationStatus.ApplyedButSaidNo}`,
+				`${ApplicationStatus.TasksToDo}`
+			];
+
+			const baseLinks: { source: NodeType; target: NodeType; value: 0 | 1; end?: boolean }[] =
+				[
 					{ source: 'Linkedin', target: 'Applications', value: 0 },
 					{ source: 'Glassdoor', target: 'Applications', value: 0 },
 					{ source: 'Unknown Source', target: 'Applications', value: 0 },
 					{ source: 'Applications', target: ApplicationStatus.ToApply, value: 1 },
 					{ source: 'Applications', target: ApplicationStatus.Ignore, value: 1 },
 					{ source: 'Applications', target: ApplicationStatus.Expired, value: 1 },
-				{ source: 'Applications', target: ApplicationStatus.WorkingOnIt, value: 1 },
 					{ source: 'Applications', target: ApplicationStatus.Applyed, value: 1 },
+					{
+						source: 'Applications',
+						target: ApplicationStatus.LinkedApplication,
+						value: 1
+					},
 
 					{
 						source: ApplicationStatus.Applyed,
@@ -68,8 +84,16 @@
 				} else {
 					nodeTypes['Unknown Source'] += 1;
 				}
+				if (a.status !== ApplicationStatus.WorkingOnIt) {
 					nodeTypes[a.status] += 1;
-				if ([ApplicationStatus.ApplyedButSaidNo, ApplicationStatus.TasksToDo].includes(a.status) ) {
+				} else {
+					nodeTypes[ApplicationStatus.ToApply] += 1;
+				}
+				if (
+					[ApplicationStatus.ApplyedButSaidNo, ApplicationStatus.TasksToDo].includes(
+						a.status
+					)
+				) {
 					nodeTypes[ApplicationStatus.Applyed] += 1;
 				}
 			});
@@ -84,8 +108,9 @@
 						value: nodeTypes[a],
 						originalValue: a,
 						id: '',
-						color: 'red',
-						index: i
+						index: i,
+						percentage: Math.trunc((nodeTypes[a] / applications.length) * 100),
+						end: showPercentage.includes(`${a}`)
 					};
 					if (Number.isNaN(Number(a))) {
 						base.id = a as string;
@@ -115,7 +140,7 @@
 			let sankey = mySankey()
 				.nodeWidth(20)
 				.nodePadding(10)
-				.size([bounding.width, bounding.height]);
+				.size([bounding.width, bounding.height - 20]);
 
 			let path = sankey.link();
 
@@ -202,7 +227,7 @@
 				.attr('text-anchor', 'end')
 				.attr('transform', null)
 				.text(function (d) {
-					return `${d.id} (${d.value})`;
+					return `${d.id} (${d.value} ${d.end ? `${d.percentage}%` : ''})`;
 				})
 				.filter(function (d) {
 					return d.x < bounding.width / 2;

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

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import type { Application } from '$lib/ApplicationsStore.svelte';
+	import { ApplicationStatus, ApplicationStatusMaping, type Application } from '$lib/ApplicationsStore.svelte';
 	import { post, put } from '$lib/utils';
 
 	let {
@@ -27,6 +27,7 @@
 	async function submit(item: Application) {
 		try {
 			application.linked_application = item.id;
+            application.status = ApplicationStatus.LinkedApplication;
 			await put('application/update', application);
 			dialog.close();
 			onreload(item);

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

@@ -15,6 +15,7 @@
 	import { userStore } from '$lib/UserStore.svelte';
 	import LinkApplication from './LinkApplication.svelte';
 	import ApplicationsList from '../ApplicationsList.svelte';
+	import TasksToDoList from '../TasksToDoList.svelte';
 
 	let activeItem: Application | undefined = $state();
 
@@ -435,7 +436,9 @@
 					<DropZone icon="trash-fill text-danger" ondrop={() => remove()}
 						>Delete it</DropZone
 					>
+				{/if}
 
+				{#if [ApplicationStatus.WorkingOnIt, ApplicationStatus.TasksToDo].includes(activeItem.status)}
 					<!-- Applyed -->
 					<DropZone
 						icon="server text-confirm"