feat: Add Creator hub link to Templates page (#7721)

Replace the `New Blank Workflow` button with link to the new Creator Hub
in the Templates page

packages/design-system/src/components/N8nActionBox/__tests__/__snapshots__/ActionBox.spec.ts.snap

@@ -9,7 +9,7 @@ exports[`N8NActionBox > should render correctly 1`] = `
   <div class=\\"description\\">
     <n8n-text-stub color=\\"text-base\\" bold=\\"false\\" size=\\"medium\\" compact=\\"false\\" tag=\\"span\\"></n8n-text-stub>
   </div>
-  <n8n-button-stub label=\\"Do something\\" type=\\"primary\\" size=\\"large\\" loading=\\"false\\" disabled=\\"false\\" outline=\\"false\\" text=\\"false\\" block=\\"false\\" active=\\"false\\" square=\\"false\\"></n8n-button-stub>
+  <n8n-button-stub label=\\"Do something\\" type=\\"primary\\" size=\\"large\\" loading=\\"false\\" disabled=\\"false\\" outline=\\"false\\" text=\\"false\\" block=\\"false\\" active=\\"false\\" square=\\"false\\" element=\\"button\\"></n8n-button-stub>
   <!--v-if-->
 </div>"
 `;

packages/design-system/src/components/N8nButton/Button.vue

@@ -1,9 +1,11 @@
 <template>
-	<button
+	<component
+		:is="element"
 		:class="classes"
 		:disabled="isDisabled"
 		:aria-disabled="ariaDisabled"
 		:aria-busy="ariaBusy"
+		:href="href"
 		aria-live="polite"
 		v-bind="$attrs"
 	>
@@ -14,13 +16,13 @@
 		<span v-if="label || $slots.default">
 			<slot>{{ label }}</slot>
 		</span>
-	</button>
+	</component>
 </template>
 
 <script setup lang="ts">
 import N8nIcon from '../N8nIcon';
 import N8nSpinner from '../N8nSpinner';
-import { useCssModule, computed, useAttrs } from 'vue';
+import { useCssModule, computed, useAttrs, watchEffect } from 'vue';
 
 const $style = useCssModule();
 const $attrs = useAttrs();
@@ -72,6 +74,21 @@ const props = defineProps({
 		type: Boolean,
 		default: false,
 	},
+	element: {
+		type: String,
+		default: 'button',
+		validator: (value: string) => ['button', 'a'].includes(value),
+	},
+	href: {
+		type: String,
+		required: false,
+	},
+});
+
+watchEffect(() => {
+	if (props.element === 'a' && !props.href) {
+		console.error('n8n-button:href is required for link buttons');
+	}
 });
 
 const ariaBusy = computed(() => (props.loading ? 'true' : undefined));