fix: align home app card icons (#2788)

public/openai-favicon.svg

@@ -0,0 +1,3 @@
+<svg width="268" height="265" viewBox="0 0 268 265" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M102.482 96.392V71.234C102.482 69.116 103.277 67.526 105.131 66.467L155.712 37.339C162.596 33.367 170.806 31.513 179.279 31.513C211.056 31.513 231.186 56.142 231.186 82.357C231.186 84.21 231.186 86.328 230.916 88.448L178.484 57.729C175.307 55.877 172.128 55.877 168.951 57.729L102.482 96.392ZM220.589 194.373V134.259C220.589 130.55 219 127.903 215.822 126.049L149.354 87.388L171.069 74.94C172.923 73.882 174.512 73.882 176.364 74.94L226.945 104.07C241.506 112.544 251.306 130.55 251.306 148.027C251.306 168.153 239.396 186.69 220.589 194.37V194.373ZM86.859 141.41L65.144 128.699C63.292 127.642 62.496 126.053 62.496 123.933V65.676C62.496 37.34 84.2111 15.89 113.607 15.89C124.729 15.89 135.054 19.599 143.796 26.218L91.627 56.407C88.452 58.261 86.861 60.909 86.861 64.617V141.413L86.859 141.41ZM133.598 168.42L102.482 150.943V113.871L133.598 96.394L164.713 113.871V150.943L133.598 168.42ZM153.592 248.926C142.469 248.926 132.143 245.217 123.403 238.598L175.57 208.407C178.747 206.555 180.336 203.906 180.336 200.197V123.402L202.317 136.113C204.171 137.17 204.966 138.76 204.966 140.88V199.137C204.966 227.472 182.985 248.923 153.592 248.923V248.926ZM90.8311 189.872L40.25 160.742C25.684 152.268 15.888 134.262 15.888 116.785C15.888 96.394 28.069 78.122 46.869 70.442V130.819C46.869 134.528 48.46 137.175 51.636 139.029L117.841 177.425L96.126 189.872C94.273 190.93 92.6831 190.93 90.8311 189.872ZM87.92 233.301C57.995 233.301 36.0161 210.791 36.0161 182.986C36.0161 180.868 36.282 178.75 36.544 176.63L88.7111 206.821C91.8881 208.673 95.0691 208.673 98.244 206.821L164.713 168.423V193.58C164.713 195.7 163.918 197.289 162.064 198.347L111.485 227.477C104.599 231.449 96.3891 233.301 87.9171 233.301H87.92ZM153.592 264.812C185.635 264.812 212.379 242.039 218.473 211.85C248.136 204.169 267.196 176.364 267.196 148.03C267.196 129.493 259.256 111.487 244.956 98.51C246.276 92.949 247.076 87.388 247.076 81.828C247.076 43.961 216.354 15.624 180.868 15.624C173.719 15.624 166.834 16.681 159.95 19.067C148.031 7.414 131.613 0 113.607 0C81.5641 0 54.819 22.773 48.726 52.962C19.067 60.643 0 88.448 0 116.782C0 135.32 7.94402 153.326 22.244 166.302C20.919 171.863 20.125 177.425 20.125 182.985C20.125 220.852 50.844 249.189 86.33 249.189C93.478 249.189 100.364 248.131 107.249 245.745C119.165 257.398 135.584 264.812 153.592 264.812Z" fill="black" />
+</svg>

public/slack-favicon.svg

@@ -0,0 +1,17 @@
+<svg width="54" height="54" viewBox="0 0 54 54" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <g clip-path="url(#slack-favicon-clip)">
+    <path d="M11.379 33.9993C11.379 37.1358 8.84512 39.6507 5.7276 39.6507C2.61008 39.6507 0.0572205 37.1168 0.0572205 33.9993C0.0572205 30.8817 2.5911 28.3479 5.70862 28.3479H11.36V33.9993H11.379Z" fill="#E01E5A" />
+    <path d="M14.1962 33.9997C14.1962 30.8632 16.7301 28.3483 19.8476 28.3483C22.9651 28.3483 25.499 30.8822 25.499 33.9997V48.1353C25.499 51.2718 22.9651 53.7867 19.8476 53.7867C16.7301 53.7867 14.1962 51.2718 14.1962 48.1353V33.9997Z" fill="#E01E5A" />
+    <path d="M19.8662 11.2673C16.7296 11.2673 14.2148 8.73347 14.2148 5.61594C14.2148 2.49842 16.7486 -0.0354538 19.8662 -0.0354538C22.9837 -0.0354538 25.5175 2.49842 25.5175 5.61594V11.2673H19.8662Z" fill="#36C5F0" />
+    <path d="M19.8682 14.1334C23.0047 14.1334 25.5196 16.6673 25.5196 19.7848C25.5196 22.9023 22.9857 25.4362 19.8682 25.4362H5.67566C2.53916 25.4362 0.0242615 22.9023 0.0242615 19.7848C0.0242615 16.6673 2.55814 14.1334 5.67566 14.1334H19.8682Z" fill="#36C5F0" />
+    <path d="M42.5323 19.7853C42.5323 16.6488 45.0662 14.1339 48.1837 14.1339C51.3012 14.1339 53.8351 16.6678 53.8351 19.7853C53.8351 22.9028 51.3012 25.4367 48.1837 25.4367H42.5323V19.7853Z" fill="#2EB67D" />
+    <path d="M39.7126 19.7934C39.7126 22.9299 37.1787 25.4448 34.0612 25.4448C30.9436 25.4448 28.4098 22.911 28.4098 19.7934V5.61986C28.4098 2.48336 30.9436 -0.0315399 34.0612 -0.0315399C37.1787 -0.0315399 39.7126 2.48336 39.7126 5.61986V19.7934Z" fill="#2EB67D" />
+    <path d="M34.0376 42.482C37.1741 42.482 39.689 45.0158 39.689 48.1334C39.689 51.2509 37.1552 53.7848 34.0376 53.7848C30.9201 53.7848 28.3862 51.2509 28.3862 48.1334V42.482H34.0376Z" fill="#ECB22E" />
+    <path d="M34.0381 39.6507C30.9016 39.6507 28.3867 37.1168 28.3867 33.9993C28.3867 30.8818 30.9206 28.3479 34.0381 28.3479H48.2306C51.3671 28.3479 53.882 30.8818 53.882 33.9993C53.882 37.1168 51.3482 39.6507 48.2306 39.6507H34.0381Z" fill="#ECB22E" />
+  </g>
+  <defs>
+    <clipPath id="slack-favicon-clip">
+      <rect width="54" height="54" fill="white" />
+    </clipPath>
+  </defs>
+</svg>

src/components/HomeAppsSection.tsx

@@ -185,9 +185,6 @@ const appCategories = [
   },
 ] as const;
 
-const slackWorkflowPlugin =
-  HOME_PLUGIN_SHORTCUTS.find((shortcut) => shortcut.id === "slack") ?? HOME_PLUGIN_SHORTCUTS[0];
-
 const workflowHeaderTiles: ReadonlyArray<{
   label: string;
   src: string;
@@ -196,12 +193,12 @@ const workflowHeaderTiles: ReadonlyArray<{
 }> = [
   {
     label: "OpenAI",
-    src: homeAppIconUrl("openai.com"),
+    src: "/openai-favicon.svg",
     className: "is-openai",
   },
   {
     label: "Slack",
-    src: homePluginShortcutIconUrl(slackWorkflowPlugin),
+    src: "/slack-favicon.svg",
     className: "is-slack",
   },
   {

src/styles.css

@@ -25268,6 +25268,12 @@ a.publisher-profile-detail:hover {
   object-fit: contain;
 }
 
+.home-v2-apps-workflow-tile.is-openai img,
+.home-v2-apps-workflow-tile.is-slack img {
+  width: 36.75px;
+  height: 36.75px;
+}
+
 .home-v2-apps-workflow-tile span {
   position: absolute;
   top: -8px;
@@ -26240,6 +26246,12 @@ a.home-v2-apps-see-all:focus-visible svg {
     height: 22px;
   }
 
+  .home-v2-apps-workflow-tile.is-openai img,
+  .home-v2-apps-workflow-tile.is-slack img {
+    width: 19.25px;
+    height: 19.25px;
+  }
+
   .home-v2-apps-workflow-tile span {
     top: -5px;
     right: -7px;