Dynamic OGs Again Again 😭 (#178)

* add a lineclamp in case of description

* add templates page case

Author: bryantgillespie

components/OgImage/Default.vue

@@ -89,7 +89,7 @@ defineProps<OgProps>();
 					</h1>
 				</div>
 				<div v-if="publishedAt" class="flex">
-					<div class="text-xl text-slate-500">
+					<div class="text-xl text-slate-500 line-clamp-2">
 						{{ publishedAt }}
 					</div>
 				</div>

utils/og.ts

@@ -55,6 +55,18 @@ export function getOgProps(baseUrl: string, collection: string, item = {} as any
 			};
 		}
 
+		case 'templates': {
+			return {
+				...props,
+				title: item.name ?? 'Directus Template',
+				imageUrl: `${baseUrl}/${item.image?.id}?format=jpeg&width=800`,
+				badgeLabel: 'Directus Template',
+				publishedAt: item.description,
+				authorName: userName(item.creator),
+				authorImage: `${baseUrl}/${item.creator?.avatar}?format=jpeg&width=800`,
+			};
+		}
+
 		default:
 			return props;
 	}