use LOGO constant instead of fixed string in OgImages (#5234)

* use LOGO constant instead of fixed string in OgImages

* fixed linting error

Co-authored-by: René Müller <rene.mueller@clicksports.de>
Co-authored-by: Peer Richelsen <peeroke@gmail.com>

packages/lib/OgImages.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 
-import { CAL_URL } from "./constants";
+import { CAL_URL, LOGO } from "./constants";
 
 // Ensures tw prop is typed.
 declare module "react" {
@@ -119,7 +119,7 @@ export const Meeting = ({ title, users = [], profile }: MeetingImageProps) => {
     <Wrapper variant="dark">
       <div tw="h-full flex flex-col justify-start">
         <div tw="flex items-center justify-center" style={{ fontFamily: "cal", fontWeight: 300 }}>
-          <img src={`${CAL_URL}/cal-logo-word-black.svg`} width="350" alt="Logo" />
+          <img src={`${CAL_URL}/${LOGO}`} width="350" alt="Logo" />
           {avatars.length > 0 && <div tw="font-bold text-black text-[92px] mx-8 bottom-2">/</div>}
           <div tw="flex flex-row">
             {avatars.slice(0, 3).map((avatar) => (
@@ -189,12 +189,7 @@ const VisualBlur = ({ visualSlug }: { visualSlug: string }) => {
 
 export const App = ({ name, description, slug }: AppImageProps) => (
   <Wrapper>
-    <img
-      src={`${CAL_URL}/cal-logo-word-black.svg`}
-      width="150"
-      alt="Logo"
-      tw="absolute right-[48px] top-[48px]"
-    />
+    <img src={`${CAL_URL}/${LOGO}`} width="150" alt="Logo" tw="absolute right-[48px] top-[48px]" />
 
     <VisualBlur visualSlug={slug} />