when in drafts if you click on an email listed there it will open the compose window with the info of that draft

lib/Compose.dart

@@ -1,3 +1,5 @@
+import 'package:crab_ui/api_service.dart';
+import 'package:crab_ui/structs.dart';
 import 'package:flutter/material.dart';
 import 'package:super_editor/super_editor.dart';
 import 'package:super_editor_markdown/super_editor_markdown.dart';
@@ -6,12 +8,14 @@ class ComposeEmail extends StatefulWidget {
   final VoidCallback onClose;
   final Function(String) onMinimize;
   final Function(String) onSendMessage;
-  const ComposeEmail({
+  GetThreadResponse? emailDraftID;
-    Key? key,
+  ComposeEmail(
+      {Key? key,
       required this.onMinimize,
       required this.onClose,
       required this.onSendMessage,
-  }) : super(key: key);
+      this.emailDraftID})
+      : super(key: key);
 
   @override
   _ComposeEmailState createState() => _ComposeEmailState();
@@ -23,20 +27,38 @@ class _ComposeEmailState extends State<ComposeEmail> {
   late final MutableDocument _document;
   late final MutableDocumentComposer _composer;
   TextEditingController _emailRecipientController = TextEditingController();
+  TextEditingController _emailSubjectController = TextEditingController();
+  List<String>? contentOfDraft;
 
   @override
   void initState() {
     super.initState();
+    _loadDraftContent();
+  }
 
+  void _loadDraftContent() async {
+    if (widget.emailDraftID != null) {
+      String? drafted = widget.emailDraftID?.messages.last;
+      if (drafted != null) {
+        contentOfDraft =
+            await ApiService().fetchMarkdownContent([drafted!], "Drafts");
+        setState(() {
           _document = MutableDocument(nodes: [
             ParagraphNode(
               id: Editor.createNodeId(),
-        text: AttributedText("hello world!"),
+              text: AttributedText(contentOfDraft?[0] ??
+                  ""), // NOW THIS SHOULD BE WTV ITS IN DRAFTS
             )
           ]);
           _composer = MutableDocumentComposer();
-    _editor =
+          _editor = createDefaultDocumentEditor(
-        createDefaultDocumentEditor(document: _document!, composer: _composer!);
+              document: _document, composer: _composer);
+          _emailRecipientController.text =
+              widget.emailDraftID!.to[0].address;
+          _emailSubjectController.text = widget.emailDraftID!.subject;
+        });
+      }
+    }
   }
 
   @override
@@ -70,7 +92,7 @@ class _ComposeEmailState extends State<ComposeEmail> {
                       icon: Icon(Icons.minimize, color: Colors.grey[600])),
                   IconButton(
                       onPressed: () {
-                        //TODO: implement that maximizing
+                        //TODO: implement maximizing the window or widget
                       },
                       icon: Icon(Icons.maximize, color: Colors.grey[600])),
                   IconButton(
@@ -82,8 +104,8 @@ class _ComposeEmailState extends State<ComposeEmail> {
               ),
               Container(
                 // TODO: WHEN NOT CLICKED ITS ONLY A TEXTFIELD WITH A HINT, AND THEN WHEN CLICKED THIS
-                width: 500.0,
+                // width: 500.0,
-                height: 40.0,
+                // height: 40.0,
                 child: Row(
                   children: [
                     TextButton(onPressed: () {}, child: Text("To:")),
@@ -100,24 +122,94 @@ class _ComposeEmailState extends State<ComposeEmail> {
                   ],
                 ),
               ),
+              SizedBox(
+                height: 4,
+              ),
+              Container(
+                // TODO: WHEN NOT CLICKED ITS ONLY A TEXTFIELD WITH A HINT, AND THEN WHEN CLICKED THIS
+                width: 500.0,
+                // height: 40.0,
+                child: Row(
+                  children: [
+                    Expanded(
+                      child: TextField(
+                        controller: _emailSubjectController,
+                        decoration: InputDecoration(
+                          hintText: "Subject",
+                        ),
+                      ),
+                    )
+                  ],
+                ),
+              ),
               Expanded(
                 //here the widget goes
                 child: SuperEditor(
+                  //make this its own
                   editor: _editor!,
                   plugins: {MarkdownInlineUpstreamSyntaxPlugin()},
-                    stylesheet: Stylesheet(
+
-                      rules: [StyleRule(BlockSelector.all, (doc, docNode) {
+                  // stylesheet: Stylesheet(
-                        return {
+                  //   rules: [StyleRule(BlockSelector.all, (doc, docNode) {
-                          Styles.maxWidth: 640.0,
+                  //     return {
-                          Styles.padding: const CascadingPadding.symmetric(horizontal: 24),
+                  //       Styles.maxWidth: 640.0,
-                          Styles.textStyle: const TextStyle(
+                  //       Styles.padding: const CascadingPadding.symmetric(horizontal: 24),
-                            color: Colors.black,
+                  //       Styles.textStyle: const TextStyle(
-                            fontSize: 15,
+                  //         color: Colors.black,
-                            height: 1.4,
+                  //         // fontSize: 15,
+                  //         height: 1.4,
+                  //       ),
+                  //     };
+                  //   }),],
+                  // inlineTextStyler: defaultInlineTextStyler)
                 ),
-                        };
+              ),
-                      }),],
+              Container(
-                      inlineTextStyler: defaultInlineTextStyler)
+                padding: EdgeInsets.symmetric(horizontal: 20, vertical: 5),
+                child: Row(
+                  mainAxisAlignment: MainAxisAlignment.start,
+                  children: [
+                    ElevatedButton(
+                      onPressed: () {
+                        print('sent');
+                        String markdown =
+                            serializeDocumentToMarkdown(_editor.document);
+
+                        print(_emailRecipientController.text);
+                        print(_emailSubjectController.text);
+                        print(markdown);
+                        ApiService().sendEmail(_emailRecipientController.text,
+                            _emailSubjectController.text, markdown);
+                      },
+                      style: ElevatedButton.styleFrom(
+                          shape: RoundedRectangleBorder(
+                              borderRadius: BorderRadius.circular(30)),
+                          elevation: 4,
+                          foregroundColor: Colors.white,
+                          backgroundColor: Colors.blueAccent),
+                      child: Row(
+                        mainAxisSize: MainAxisSize.min,
+                        children: [
+                          const Text(
+                            'Send',
+                            style: TextStyle(fontWeight: FontWeight.bold),
+                          ),
+                          // const SizedBox(
+                          //   width: 8,
+                          // ),
+                          // Container(
+                          //     height: 30, width: 1.0, color: Colors.white),
+                          // const SizedBox(
+                          //   width: 8,
+                          // ),
+                          // const Icon(
+                          //   Icons.arrow_drop_down,
+                          //   size: 24,
+                          // )
+                        ],
+                      ),
+                    ),
+                  ],
                 ),
               )
             ])),
@@ -131,6 +223,7 @@ class OverlayService {
   factory OverlayService() => _instance;
   OverlayService._internal();
   OverlayEntry? _overlayEntry;
+  GetThreadResponse? draftID;
 
   void showPersistentWidget(BuildContext context) {
     if (_overlayEntry != null) {
@@ -148,7 +241,7 @@ class OverlayService {
             onSendMessage: (message) {
               print('msg senf form overlay $message');
             },
-            ));
+            emailDraftID: draftID));
     Navigator.of(context).overlay?.insert(_overlayEntry!);
     print("inserted into tree");
   }