From 77ad1fdb367ef61d55adbe07fa517475b5626b94 Mon Sep 17 00:00:00 2001
From: Hunter Miller <hunter@tlon.io>
Date: Thu, 16 Sep 2021 16:23:11 -0500
Subject: [PATCH] permalink: app embed image support

---
 .../src/views/apps/permalinks/embed.tsx       | 21 +++++++++++++------
 1 file changed, 15 insertions(+), 6 deletions(-)

diff --git a/pkg/interface/src/views/apps/permalinks/embed.tsx b/pkg/interface/src/views/apps/permalinks/embed.tsx
index 9641f728d6..11067cfd10 100644
--- a/pkg/interface/src/views/apps/permalinks/embed.tsx
+++ b/pkg/interface/src/views/apps/permalinks/embed.tsx
@@ -1,4 +1,4 @@
-import { BaseAnchor, Box, Button, Center, Col, H3, Icon, Row, Text } from '@tlon/indigo-react';
+import { BaseAnchor, Box, Button, Center, Col, H3, Icon, Image, Row, Text } from '@tlon/indigo-react';
 import { Association, GraphNode, resourceFromPath, GraphConfig } from '@urbit/api';
 import React, { useCallback, useEffect, useState } from 'react';
 import _ from 'lodash';
@@ -212,18 +212,27 @@ function AppPermalink({ link, ship, desk }: Omit<IAppPermalink, 'type'>) {
       padding={3}
       bg="washedGray"
       borderRadius={3}
-      onClick={(e) => {
-        e.stopPropagation();
-      }}
     >
       <Box
+        position="relative"
         flex="none"
         height="132px"
         width="132px"
         marginRight={3}
         borderRadius={3}
-        bg={treaty?.color || '#333333'}
-      />
+        bg={treaty?.color || 'gray'}
+      >
+        {treaty?.image && (
+          <Image
+            src={treaty.image}
+            position="absolute"
+            top="0"
+            left="0"
+            width="100%"
+            height="100%"
+          />
+        )}
+      </Box>
       <Col>
         <H3 color="black">{treaty?.title}</H3>
         {treaty?.ship && <Author ship={treaty?.ship} showImage dontShowTime={true} marginBottom={2} />}