feat: add tags format change message

jsdelivr · Jan 31, 2025 · 3c10619 · 3c10619
1 parent 5e152ec
commit 3c10619
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 5 deletions.
diff --git a/pages/probes.vue b/pages/probes.vue
@@ -295,7 +295,7 @@
 
 	const getAllTags = (probe: Probe) => {
 		const systemTags = probe.systemTags;
-		const userTags = probe.tags.map(({ prefix, value }) => `u-${prefix}-${value}`);
+		const userTags = probe.tags.map(({ prefix, value, format }) => format === 'v1' ? `u-${prefix}-${value}` : `u-${prefix}:${value}`);
 		const allTags = userTags.concat(systemTags);
 		return allTags;
 	};

diff --git a/pages/probes/[id].vue b/pages/probes/[id].vue
@@ -92,6 +92,10 @@
 			<label for="userTags" class="mt-4 inline-block text-xs">User tags</label>
 			<div v-if="isEditingTags" class="mt-1">
 				<div>
+					<Message v-if="probe.tags[0]?.format === 'v1'" severity="warn" class="mb-1 mt-2">
+						<p class="font-bold">Your tags have an outdated format</p>
+						<p class="mt-1">Format like <Tag class="text-nowrap bg-surface-0 font-normal dark:bg-dark-800" severity="secondary" :value="`u-${probe.tags[0].prefix}-${probe.tags[0].value}`"/> is outdated on will be replaced by <Tag class="text-nowrap bg-surface-0 font-normal dark:bg-dark-800" severity="secondary" :value="`u-${probe.tags[0].prefix}:${probe.tags[0].value}`"/> on any change of the tags for that probe. Please make sure to update your tools if they depend on that.</p>
+					</Message>
 					<div class="flex text-xs">
 						<div class="flex-1 content-center">Prefix</div>
 						<div class="mx-3"/>
@@ -100,7 +104,7 @@
 					</div>
 					<div v-for="(tag, index) in tagsToEdit" :key="index" class="mb-2 flex items-center" :class="{ 'mb-5': !isTagValid(tag.value) }">
 						<Select v-model="tag.uPrefix" class="flex-1" :options="uPrefixes" :scroll-height="'200px'"/>
-						<div class="mx-2">-</div>
+						<div class="mx-2">{{ probe.tags[0]?.format === 'v1' ? '-' : ':' }}</div>
 						<div class="relative flex-1">
 							<InputText v-model="tag.value" :invalid="!isTagValid(tag.value)" class="w-full" placeholder="my-tag"/>
 							<p v-if="!isTagValid(tag.value)" class="absolute pl-1 text-red-500">Invalid tag</p>
@@ -150,7 +154,7 @@
 				Public user-defined tags that can be used to target the probe in measurements.
 				Each tag must be prefixed by your GitHub username or organization.
 				E.g., for a user with username <code class="font-bold">jimaek</code>
-				and tag <code class="font-bold">home-1</code> the final tag would be <code class="whitespace-nowrap font-bold">u-jimaek-home-1</code>.
+				and tag <code class="font-bold">home-1</code> the final tag would be <code class="whitespace-nowrap font-bold">u-jimaek:home-1</code>.
 			</p>
 
 			<div class="mt-7 flex justify-end">
@@ -257,7 +261,7 @@
 	// TAGS
 
 	const isEditingTags = ref<boolean>(false);
-	const userTags = computed(() => probe.value.tags.map(({ prefix, value }) => `u-${prefix}-${value}`));
+	const userTags = computed(() => probe.value.tags.map(({ prefix, value, format }) => format === 'v1' ? `u-${prefix}-${value}` : `u-${prefix}:${value}`));
 	const tagsToEdit = ref<{ uPrefix: string, value: string }[]>([]);
 
 	const uPrefixes = [ user.github_username, ...user.github_organizations ].map(value => `u-${value}`);

diff --git a/presets/aura/inputtext/index.js b/presets/aura/inputtext/index.js
@@ -25,7 +25,7 @@ export default {
 			{ 'first:ml-0 -ml-px': parent.instance.$name === 'InputGroup' && !props.showButtons },
 
 			// Colors
-			'placeholder:text-bluegray-400 dark:placeholder:text-surface-200',
+			'placeholder:text-bluegray-400 dark:placeholder:text-surface-500',
 			{ 'text-bluegray-900 dark:text-surface-0 bg-surface-0 dark:bg-dark-900': !context.disabled },
 			'border',
 			{ 'border-surface-300 dark:border-dark-600': !props.invalid },

diff --git a/types.ts b/types.ts
@@ -68,6 +68,7 @@ declare global {
     tags: {
         value: string;
         prefix: string;
+        format?: string;
       }[],
     systemTags: string[],
     userId: string;