feat: add missing tags to og checker (#113)

apps/dashboard/src/components/Splash/Tools/OpenGraphImageChecker.tsx

@@ -13,7 +13,12 @@ import { useDebouncedCallback } from "use-debounce";
 import { usePreviewControls } from "../../../lib/hooks/usePreviewControls";
 import { InfoIcon } from "../../icons/InfoIcon";
 import { OgImage } from "../../OgImage";
-import { META_KEYS, META_TAGS, type MetaTags } from "../../../lib/meta";
+import {
+  META_KEYS,
+  META_TAGS,
+  REQUIRED_META_TAGS,
+  type MetaTags,
+} from "../../../lib/meta";
 
 export function OpenGraphImageChecker() {
   const [loading, setLoading] = useState(false);
@@ -98,7 +103,8 @@ export function OpenGraphImageChecker() {
                       {loading ? (
                         <Skeleton width="300px" />
                       ) : (
-                        data?.[tag] ?? "⚠️ Missing value"
+                        data?.[tag] ??
+                        `⚠️ Missing value (${REQUIRED_META_TAGS.includes(tag) ? "required" : "optional"})`
                       )}
                     </Table.Cell>
                   </Table.Row>

apps/dashboard/src/lib/meta.ts

@@ -1,13 +1,21 @@
 export const META_TAGS = {
   "og:title": "The title of your object as it should appear within the graph.",
-  "og:description": "A one to two sentence description of your object.",
-  "og:site_name": "The name which should be displayed for the overall site.",
-  "og:url":
-    "The canonical URL of your object that will be used as its permanent ID in the graph.",
+  "og:type": "The type of your object, e.g., 'video.movie'.",
   "og:image":
     "An image URL which should represent your object within the graph.",
+  "og:url":
+    "The canonical URL of your object that will be used as its permanent ID in the graph.",
+  "og:description": "A one to two sentence description of your object.",
+  "og:site_name": "The name which should be displayed for the overall site.",
 } as const;
 
+export const REQUIRED_META_TAGS: MetaTags[] = [
+  "og:title",
+  "og:type",
+  "og:image",
+  "og:url",
+];
+
 export const META_KEYS = Object.keys(META_TAGS) as MetaTags[];
 
 export type MetaTags = keyof typeof META_TAGS;