refactor(frontend): replace toast api (#346)

frontend/src/lib/components/dashboard/GroupTab.svelte

@@ -103,12 +103,12 @@
 								})
 							).json();
 							groups = [...groups, newGroup];
-							addToast({
-								message: `The ${newGroup.name} group was created successfully`,
-								type: ToastType.Info,
-								dismissible: true,
-								timeout: 1500
-							});
+							addToast(
+								`The ${newGroup.name} group was created successfully`,
+								ToastType.Info,
+								true,
+								1500
+							);
 							showNewGroupInput = false;
 						}
 					}}

frontend/src/lib/components/dashboard/ServerTab.svelte

@@ -11,30 +11,20 @@
 	<div>
 		<button
 			onclick={async () => {
-				const tid = addToast({
-					message: `Cloning fresh repository, this may take a while...`,
-					type: ToastType.Info,
-					dismissible: false
-				});
+				const toastId = addToast(
+					`Cloning fresh repository, this may take a while...`,
+					ToastType.Info,
+					false
+				);
 				const response = await fetch(`${apiAddress}/api/reclone`, {
 					method: 'POST',
 					credentials: 'include'
 				});
-				dismissToast(tid);
+				dismissToast(toastId);
 				if (response.ok) {
-					addToast({
-						message: `Cloned fresh repository successfully`,
-						type: ToastType.Success,
-						dismissible: true,
-						timeout: 3000
-					});
+					addToast(`Cloned fresh repository successfully`, ToastType.Success);
 				} else {
-					addToast({
-						message: `Clone failed, check server logs`,
-						type: ToastType.Error,
-						dismissible: true,
-						timeout: 3000
-					});
+					addToast(`Clone failed, check server logs`, ToastType.Error);
 				}
 			}}
 		>

frontend/src/lib/components/dashboard/UserTab.svelte

@@ -39,13 +39,11 @@
 			if (groupToAdd) {
 				await addUserToGroup(users[selectedUser], groupToAdd);
 			} else {
-				addToast({
-					message:
-						"Wasn't able to add the selected group to that user because that checkbox has an ID tied to a group that does not exist, \
+				addToast(
+					"Wasn't able to add the selected group to that user because that checkbox has an ID tied to a group that does not exist, \
 						please report this to the developer.",
-					type: ToastType.Error,
-					dismissible: true
-				});
+					ToastType.Error
+				);
 			}
 		} else {
 			const groupToRemove = allGroups.find((g) => g.name === target.id);

frontend/src/lib/components/editors/AssetEditor.svelte

@@ -29,19 +29,14 @@
 			assetTree.set(await (await fetch(`${apiAddress}/api/tree/asset`)).json());
 			loadingIconVisible = false;
 			if (r.ok) {
-				addToast({
-					message: `"${file.name}" was uploaded successfully`,
-					type: ToastType.Info,
-					dismissible: true,
-					timeout: 1500
-				});
+				addToast(`"${file.name}" was uploaded successfully`, ToastType.Info, true, 1500);
 			} else {
-				addToast({
-					message: `Failed to upload file, please report issue to the developer`,
-					type: ToastType.Error,
-					dismissible: true,
-					timeout: 1500
-				});
+				addToast(
+					`Failed to upload file, please report issue to the developer`,
+					ToastType.Error,
+					true,
+					1500
+				);
 			}
 		}
 	}
@@ -179,19 +174,19 @@
 								credentials: 'include'
 							});
 							if (r.ok) {
-								addToast({
-									message: `"${fullScreenImagePath}" was deleted successfully`,
-									type: ToastType.Info,
-									dismissible: true,
-									timeout: 1500
-								});
+								addToast(
+									`"${fullScreenImagePath}" was deleted successfully`,
+									ToastType.Info,
+									true,
+									1500
+								);
 							} else {
-								addToast({
-									message: `Failed to delete file, please report issue to the developer`,
-									type: ToastType.Error,
-									dismissible: true,
-									timeout: 1500
-								});
+								addToast(
+									`Failed to delete file, please report issue to the developer`,
+									ToastType.Error,
+									true,
+									1500
+								);
 							}
 							assetTree.set(await (await fetch(`${apiAddress}/api/tree/asset`)).json());
 							fullScreenImagePath = '';

frontend/src/lib/components/editors/DocumentEditor.svelte

@@ -47,12 +47,7 @@
 		const commitMessage = commitMessageInput.trim();
 
 		if (!(await hasChanges())) {
-			addToast({
-				message: `No changes detected to commit.`,
-				type: ToastType.Error,
-				timeout: 1000,
-				dismissible: true
-			});
+			addToast(`No changes detected to commit.`, ToastType.Error, true, 1000);
 			return;
 		}
 
@@ -72,20 +67,15 @@
 			$editorText =
 				(await cache.get(get(currentFile))) ??
 				"The current file doesn't exist in cache, please report to the developer";
-			addToast({
-				message: `Cancelled edits to "${get(currentFile)}""`,
-				type: ToastType.Success,
-				timeout: 1000,
-				dismissible: true
-			});
+			addToast(`Cancelled edits to "${get(currentFile)}""`, ToastType.Success, true, 1000);
 		} else {
 			// TODO: The button should actually be disabled when there are no unsaved changes
-			addToast({
-				message: `There are no unsaved changes to "${get(currentFile)}""`,
-				type: ToastType.Error,
-				timeout: 1000,
-				dismissible: true
-			});
+			addToast(
+				`There are no unsaved changes to "${get(currentFile)}""`,
+				ToastType.Error,
+				true,
+				1000
+			);
 		}
 	}
 

frontend/src/lib/components/sidebar/FileNavigation.svelte

@@ -78,19 +78,9 @@
 			credentials: 'include'
 		});
 		if (r.ok) {
-			addToast({
-				message: `The file "${path}" was deleted successfully."`,
-				type: ToastType.Info,
-				dismissible: true,
-				timeout: 1500
-			});
+			addToast(`The file "${path}" was deleted successfully."`, ToastType.Info, true, 1500);
 		} else {
-			addToast({
-				message: `Deletion failed, please report to the developer`,
-				type: ToastType.Error,
-				dismissible: true,
-				timeout: 1500
-			});
+			addToast(`Deletion failed, please report to the developer`, ToastType.Error, true, 1500);
 		}
 		// While a re-render would happen when the directory
 		// is closed and re-opened, I nuke the current element here

frontend/src/lib/components/topbar/BranchButton.svelte

@@ -59,11 +59,10 @@
 		if (!response.ok) {
 			const errorMessage = await response.json();
 			console.error('Failed to fetch branches:', errorMessage);
-			addToast({
-				message: `Error fetching branches: ${response.statusText}. ${JSON.stringify(errorMessage)}`,
-				type: ToastType.Error,
-				dismissible: true
-			});
+			addToast(
+				`Error fetching branches: ${response.statusText}. ${JSON.stringify(errorMessage)}`,
+				ToastType.Error
+			);
 			return [];
 		}
 
@@ -141,22 +140,20 @@
 
 		// Validate branch name
 		if (!isValidBranchName(input)) {
-			addToast({
-				message: 'Please ensure your branch name follows these rules:\n' + rules.join('\n'),
-				type: ToastType.Warning,
-				dismissible: true
-			});
+			addToast(
+				'Please ensure your branch name follows these rules:\n' + rules.join('\n'),
+				ToastType.Warning
+			);
 			return;
 		}
 
 		if ($allBranches.some((branch) => branch.name === input && branch.isProtected)) {
-			addToast({
-				message:
-					'Please select an existing branch name from the list of non-protected branches.\nYou can also create your own.',
-				type: ToastType.Warning,
-				dismissible: true,
-				timeout: 1800
-			});
+			addToast(
+				'Please select an existing branch name from the list of non-protected branches.\nYou can also create your own.',
+				ToastType.Warning,
+				true,
+				1800
+			);
 			return;
 		}
 
@@ -168,12 +165,7 @@
 		showMenu = false;
 
 		if (!$allBranches.some((branch) => branch.name === input)) {
-			addToast({
-				message: `Now working on a new branch: "${input}".`,
-				type: ToastType.Success,
-				dismissible: true,
-				timeout: 1800
-			});
+			addToast(`Now working on a new branch: "${input}".`, ToastType.Success, true, 1800);
 			showLoadingIcon = false;
 			return;
 		}
@@ -185,11 +177,10 @@
 		});
 
 		if (!response.ok) {
-			addToast({
-				message: `Failed to check out branch. Error ${response.status}: ${response.statusText}`,
-				type: ToastType.Error,
-				dismissible: true
-			});
+			addToast(
+				`Failed to check out branch. Error ${response.status}: ${response.statusText}`,
+				ToastType.Error
+			);
 			showLoadingIcon = false;
 			return;
 		}
@@ -201,18 +192,14 @@
 		});
 
 		if (pullResponse.ok) {
-			addToast({
-				message: `Branch "${input}" checked out and updated successfully.`,
-				type: ToastType.Success,
-				dismissible: true,
-				timeout: 1200
-			});
+			addToast(
+				`Branch "${input}" checked out and updated successfully.`,
+				ToastType.Success,
+				true,
+				1200
+			);
 		} else {
-			addToast({
-				message: `Failed to pull latest changes for branch "${input}".`,
-				type: ToastType.Error,
-				dismissible: true
-			});
+			addToast(`Failed to pull latest changes for branch "${input}".`, ToastType.Error);
 			showLoadingIcon = false;
 			return;
 		}