✨ Thumbnail

lib/widgets/posts/editor/post_editor_thumbnail.dart

@@ -0,0 +1,96 @@
+import 'package:flutter/material.dart';
+import 'package:get/get.dart';
+import 'package:solian/controllers/post_editor_controller.dart';
+import 'package:solian/widgets/attachments/attachment_editor.dart';
+
+class PostEditorThumbnailDialog extends StatefulWidget {
+  final PostEditorController controller;
+
+  const PostEditorThumbnailDialog({super.key, required this.controller});
+
+  @override
+  State<PostEditorThumbnailDialog> createState() =>
+      _PostEditorThumbnailDialogState();
+}
+
+class _PostEditorThumbnailDialogState extends State<PostEditorThumbnailDialog> {
+  final TextEditingController _attachmentController = TextEditingController();
+
+  void _promptUploadNewAttachment() {
+    showModalBottomSheet(
+      context: context,
+      builder: (context) => AttachmentEditorPopup(
+        usage: 'i.attachment',
+        singleMode: true,
+        imageOnly: true,
+        autoUpload: true,
+        onAdd: (value) {
+          setState(() {
+            _attachmentController.text = value.toString();
+          });
+
+          widget.controller.thumbnail.value = value;
+        },
+        initialAttachments: const [],
+        onRemove: (_) {},
+      ),
+    );
+  }
+
+  @override
+  void initState() {
+    _attachmentController.text =
+        widget.controller.thumbnail.value?.toString() ?? '';
+    super.initState();
+  }
+
+  @override
+  void dispose() {
+    _attachmentController.dispose();
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return AlertDialog(
+      title: Text('postThumbnail'.tr),
+      content: Column(
+        mainAxisSize: MainAxisSize.min,
+        children: [
+          ListTile(
+            title: Text('postThumbnailAttachmentNew'.tr),
+            contentPadding: const EdgeInsets.only(left: 16, right: 13),
+            trailing: const Icon(Icons.chevron_right),
+            shape: const RoundedRectangleBorder(
+              borderRadius: BorderRadius.all(Radius.circular(8)),
+            ),
+            onTap: () {
+              _promptUploadNewAttachment();
+            },
+          ),
+          const SizedBox(height: 8),
+          TextField(
+            controller: _attachmentController,
+            decoration: InputDecoration(
+              isDense: true,
+              border: const OutlineInputBorder(),
+              prefixText: '#',
+              labelText: 'postThumbnailAttachment'.tr,
+            ),
+            onTapOutside: (_) => FocusManager.instance.primaryFocus?.unfocus(),
+          ),
+        ],
+      ),
+      actions: [
+        TextButton(
+          onPressed: () {
+            widget.controller.thumbnail.value =
+                int.tryParse(_attachmentController.text);
+            Navigator.pop(context);
+          },
+          child: Text('confirm'.tr),
+        ),
+      ],
+    );
+  }
+}

lib/widgets/posts/post_item.dart

@@ -76,6 +76,30 @@ class _PostItemState extends State<PostItem> {
     }
   }
 
+  Widget _buildThumbnail() {
+    if (widget.item.body['thumbnail'] == null) return const SizedBox();
+    const radius = BorderRadius.all(Radius.circular(8));
+    return AspectRatio(
+      aspectRatio: 16 / 9,
+      child: Container(
+        decoration: BoxDecoration(
+          border: Border.all(
+            color: Theme.of(context).dividerColor,
+            width: 0.3,
+          ),
+          borderRadius: radius,
+        ),
+        child: ClipRRect(
+          borderRadius: radius,
+          child: AttachmentSelfContainedEntry(
+            id: widget.item.body['thumbnail'],
+            parentId: 'p${item.id}-thumbnail',
+          ),
+        ),
+      ),
+    );
+  }
+
   Widget _buildHeader() {
     return Row(
       crossAxisAlignment: CrossAxisAlignment.start,
@@ -283,6 +307,7 @@ class _PostItemState extends State<PostItem> {
       return Column(
         crossAxisAlignment: CrossAxisAlignment.start,
         children: [
+          _buildThumbnail().paddingSymmetric(horizontal: 12, vertical: 4),
           _buildHeader().paddingSymmetric(horizontal: 12),
           _buildHeaderDivider().paddingSymmetric(horizontal: 12),
           Stack(
@@ -356,6 +381,7 @@ class _PostItemState extends State<PostItem> {
       closedBuilder: (_, openContainer) => Column(
         crossAxisAlignment: CrossAxisAlignment.start,
         children: [
+          _buildThumbnail().paddingSymmetric(horizontal: 12, vertical: 4),
           Row(
             crossAxisAlignment: CrossAxisAlignment.start,
             children: [
@@ -390,7 +416,7 @@ class _PostItemState extends State<PostItem> {
                               setState(() => _contentHeight = size.height);
                             },
                             child: MarkdownTextContent(
-                              parentId: 'p${item.id}',
+                              parentId: 'p${item.id}-embed',
                               content: item.body['content'],
                               isSelectable: widget.isContentSelectable,
                             ).paddingOnly(left: 12, right: 8),