From 3a51f11f12f8f8d4f6616843300a27eb2d32a137 Mon Sep 17 00:00:00 2001
From: liamcottle <liam@liamcottle.com>
Date: Mon, 29 Apr 2024 03:15:47 +1200
Subject: [PATCH] support for showing received attachments

---
 index.html | 17 ++++++++++++++++-
 web.py     | 19 +++++++++++++++++++
 2 files changed, 35 insertions(+), 1 deletion(-)

diff --git a/index.html b/index.html
index 4f511fd..711651a 100644
--- a/index.html
+++ b/index.html
@@ -68,7 +68,7 @@
                             </div>
 
                         </div>
-                        <div>
+                        <div class="w-full">
                             <div class="font-semibold leading-5">
                                 <span v-if="chatItem.is_outbound">You</span>
                                 <span v-else-if="chatItem.source_hash === 'error'">Error</span>
@@ -80,6 +80,21 @@
                                     <img @click="openImage(`data:image/${field.image_type};base64,${field.image_bytes}`)" :src="`data:image/${field.image_type};base64,${field.image_bytes}`" class="w-full rounded-md shadow-md cursor-pointer"/>
                                 </div>
                             </div>
+                            <div v-for="field of chatItem.message.fields.filter((f) => f.type === 'file_attachments')">
+                                <a target="_blank" :download="file_attachment.file_name" :href="`data:application/octet-stream;base64,${file_attachment.file_bytes}`" v-for="file_attachment of field.file_attachments" class="flex border border-gray-200 hover:bg-gray-100 rounded px-2 py-1 text-sm text-gray-700 font-semibold cursor-pointer">
+                                    <div class="mr-2 my-auto">
+                                        <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
+                                            <path stroke-linecap="round" stroke-linejoin="round" d="m18.375 12.739-7.693 7.693a4.5 4.5 0 0 1-6.364-6.364l10.94-10.94A3 3 0 1 1 19.5 7.372L8.552 18.32m.009-.01-.01.01m5.699-9.941-7.81 7.81a1.5 1.5 0 0 0 2.112 2.13"></path>
+                                        </svg>
+                                    </div>
+                                    <div class="my-auto">{{ file_attachment.file_name }}</div>
+                                    <div class="ml-auto my-auto">
+                                        <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
+                                            <path stroke-linecap="round" stroke-linejoin="round" d="M3 16.5v2.25A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75V16.5M16.5 12 12 16.5m0 0L7.5 12m4.5 4.5V3" />
+                                        </svg>
+                                    </div>
+                                </a>
+                            </div>
                         </div>
                     </div>
                 </div>
diff --git a/web.py b/web.py
index a057e6f..0c1aed2 100644
--- a/web.py
+++ b/web.py
@@ -107,6 +107,25 @@ def lxmf_delivery(message):
 
             value = message_fields[field_type]
 
+            # handle file attachments field
+            if field_type == LXMF.FIELD_FILE_ATTACHMENTS:
+
+                # process file attachments
+                file_attachments = []
+                for file_attachment in value:
+                    file_name = file_attachment[0]
+                    file_bytes = base64.b64encode(file_attachment[1]).decode("utf-8")
+                    file_attachments.append({
+                        "file_name": file_name,
+                        "file_bytes": file_bytes,
+                    })
+
+                # add to fields
+                fields.append({
+                    "type": "file_attachments",
+                    "file_attachments": file_attachments,
+                })
+
             # handle image field
             if field_type == LXMF.FIELD_IMAGE:
                 image_type = value[0]