Tag Management: UX Improvements #2198

Author: geofranzi

Console/BExIS.Web.Shell/Areas/DDM/BExIS.Modules.Ddm.UI.Svelte/src/routes/taginfo/TagInfoEdit.svelte

@@ -105,15 +105,15 @@
 		if (responce.status === 200) {
 			notificationStore.showNotification({
 				notificationType: notificationType.success,
-				message: 'Tag is generated.'
+				message: 'Release Tag is generated.'
 			});
 
 			reload();
 			dispatch('reload');
 		} else {
 			notificationStore.showNotification({
 				notificationType: notificationType.error,
-				message: 'Tag is not generated.'
+				message: 'Release Tag is not generated.'
 			});
 		}
 	}
@@ -179,7 +179,7 @@
 						disableSorting: true
 					},
 					systemDescription: {
-						header: 'System Description',
+						header: 'General Type',
 						disableFiltering: true,
 						disableSorting: true,
 						instructions: {
@@ -219,6 +219,10 @@
 						},
 						disableFiltering: true,
 						disableSorting: true
+					},
+					link: {
+						disableFiltering: true,
+						exclude: true
 					}
 				}
 			}}

Console/BExIS.Web.Shell/Areas/DDM/BExIS.Modules.Ddm.UI.Svelte/src/routes/taginfo/TagInfoView.svelte

@@ -30,12 +30,12 @@
 		<TablePlaceholder cols={2} {rows} />
 	</div>
 {:then model}
-	<h2 class="h2">Tag Preview</h2>
+	<h2 class="h2">Preview</h2>
 	<table class="table table-compact bg-tertiary-200">
 		<thead>
 			<tr class="bg-primary-300">
-				<th class="!p-2 w-16">Tag</th>
-				<th class="!p-2">Release Note</th>
+				<th scope="col" class="!p-2 w-16">Release Tag</th>
+				<th scope="col" class="!p-2">Release Note</th>
 			</tr>
 		</thead>
 		<tbody>

Console/BExIS.Web.Shell/Areas/DDM/BExIS.Modules.Ddm.UI.Svelte/src/routes/taginfo/table/tableOptions.svelte

@@ -10,7 +10,6 @@
 	let noTag: boolean = hasNoTag();
 	// use auto-subscription so changes to the store re-run reactive statements
 	let withMinor: boolean;
-
 	$: withMinor = $withMinorStore;
 
 	function hasNoTag() {
@@ -43,12 +42,12 @@
 	$: hasChanges = (() => {
 		const originalRows = $originalTagInfoModelStore;
 		const currentRow = $tagInfoModelStore.find((x) => x.versionId == row.versionId);
-		console.log('🚀 ~ hasChanges ~ currentRow:', currentRow);
-		if (!currentRow) return false;
-
 		const originalRow = originalRows.find((x) => x.versionId == row.versionId);
+
+		if (!currentRow) return false; // No current row
 		if (!originalRow) return true; // New row
 
+		// Return true if there are changes, otherwise false
 		return (
 			currentRow.releaseNote !== originalRow.releaseNote ||
 			currentRow.publish !== originalRow.publish ||
@@ -58,7 +57,8 @@
 </script>
 
 <div class="flex gap-2 w-min p-2">
-	{#if hasChanges}
+	{row.tagId}
+	{#if hasChanges && row.tagId > 0}
 		<button
 			class="btn btn-sm variant-filled-primary"
 			title="Save changes"
@@ -72,13 +72,13 @@
 		{#if withMinor}
 			<button
 				class="btn btn-sm variant-filled-primary"
-				title="Create new minor version"
+				title="Create new minor version. All untagged versions until this will belong to this minor version."
 				on:click|preventDefault={() => eventDispatchFn('MINOR')}>minor</button
 			>
 		{/if}
 		<button
 			class="btn btn-sm variant-filled-primary"
-			title="Create new major version"
+			title="Create new major version. All untagged versions until this will belong to this major version."
 			on:click|preventDefault={() => eventDispatchFn('MAJOR')}>major</button
 		>
 	{/if}

Console/BExIS.Web.Shell/Areas/DDM/BExIS.Modules.Ddm.UI.Svelte/src/routes/taginfo/table/tablePublish.svelte

@@ -9,6 +9,7 @@
 
 	$: currentRow = $tagInfoModelStore.find((x) => x.versionId == row.original.versionId);
 
+	// Update the store when the toggle is changed
 	function togglePublish(versionId: number, value: boolean) {
 		tagInfoModelStore.update((arr) =>
 			arr.map((x) => (x.versionId === versionId ? { ...x, publish: !!value } : x))
@@ -17,7 +18,7 @@
 </script>
 
 <div class="flex h-full items-center justify-center">
-	<div title="Make this release tag visible; Click save to apply">
+	<div title="Make this release tag visible; Click save to apply changes.">
 		{#if currentRow.tagId > 0}
 			<SlideToggle
 				name={currentRow.versionId}

Console/BExIS.Web.Shell/Areas/DDM/BExIS.Modules.Ddm.UI.Svelte/src/routes/taginfo/table/tableReleaseNote.svelte

@@ -20,7 +20,7 @@
 	}
 </script>
 
-<span title="Release Note; Click save to apply">
+<span title="Release Note; Click save to apply changes.">
 	<TextArea
 		bind:value={currentRow.releaseNote}
 		on:input={() =>

Console/BExIS.Web.Shell/Areas/DDM/BExIS.Modules.Ddm.UI.Svelte/src/routes/taginfo/table/tableShow.svelte

@@ -16,6 +16,7 @@
 			show: false
 		} as TagInfoEditModel);
 
+	// Update the store when the toggle is changed
 	function toggleShow(versionId: number, value: boolean) {
 		tagInfoModelStore.update((arr) =>
 			arr.map((x) => (x.versionId === versionId ? { ...x, show: !!value } : x))
@@ -24,7 +25,7 @@
 </script>
 
 <div class="flex h-full items-center justify-center">
-	<div title="Show the release note of this version; Click save to apply">
+	<div title="Show the release note of this version; Click save to apply changes.">
 		{#if currentRow && currentRow.tagId > 0}
 			<SlideToggle
 				name={'' + currentRow.versionId}

Console/BExIS.Web.Shell/Areas/DDM/BExIS.Modules.Ddm.UI.Svelte/src/routes/taginfo/table/tableText.svelte

@@ -1,6 +1,5 @@
 <script lang="ts">
 	import { TextInput } from '@bexis2/bexis2-core-ui';
-	import type { TagInfoModel } from '../types';
 
 	export let value: string;
 	export let row: any;

Console/BExIS.Web.Shell/Areas/DDM/BExIS.Modules.Ddm.UI.Svelte/src/routes/taginfo/table/tableTextAuthor.svelte

@@ -3,7 +3,7 @@
 </script>
 
 <div>
-	<span title="Person who made the change">
+	<span title="Person created this version">
 		{value}
 	</span>
 </div>

Console/BExIS.Web.Shell/Areas/DDM/BExIS.Modules.Ddm.UI.Svelte/src/routes/taginfo/table/tableTextType.svelte

@@ -3,7 +3,7 @@
 </script>
 
 <div>
-	<span title="Type of change made in this version">
+	<span title="General type of change of this version (e.g. Metadata, Data, etc.)">
 		{value}
 	</span>
 </div>

Console/BExIS.Web.Shell/Areas/DDM/BExIS.Modules.Ddm.UI/Views/TagInfo/Index.cshtml

@@ -1,6 +1,6 @@
 
 @{
-    ViewBag.Title = "tags";
+    ViewBag.Title = "Release Tags";
     Layout = "~/Themes/Default/Layouts/_svelteLayout.cshtml";
 
     long id = 0;