Implement sensitive post

locales/en/translation.json

@@ -75,7 +75,8 @@
       "unlisted": "Unlisted",
       "private": "Private",
       "direct": "Direct"
-    }
+    },
+    "nsfw": "Sensitive"
   },
   "alert": {
     "validation": {

renderer/components/compose/Compose.tsx

@@ -1,4 +1,4 @@
-import { Dropdown, FileInput, Spinner, TextInput, Textarea } from 'flowbite-react'
+import { Checkbox, Dropdown, Label, Spinner, TextInput, Textarea } from 'flowbite-react'
 import { ChangeEvent, useEffect, useRef, useState } from 'react'
 import { FormattedMessage, useIntl } from 'react-intl'
 import { FaEnvelope, FaGlobe, FaListCheck, FaLock, FaLockOpen, FaPaperPlane, FaPaperclip, FaXmark } from 'react-icons/fa6'
@@ -40,6 +40,12 @@ export default function Compose(props: Props) {
         media_ids: attachments.map(m => m.id)
       })
     }
+    const sensitive = document.getElementById('sensitive') as HTMLInputElement
+    if (sensitive.checked) {
+      options = Object.assign({}, options, {
+        sensitive: sensitive.checked
+      })
+    }
     setLoading(true)
     try {
       await props.client.postStatus(body, options)
@@ -119,6 +125,16 @@ export default function Compose(props: Props) {
           </div>
         ))}
       </div>
+
+      {attachments.length > 0 && (
+        <div>
+          <Checkbox id="sensitive" className="focus:ring-0" />
+          <Label htmlFor="sensitive" className="pl-2 text-gray-600">
+            <FormattedMessage id="compose.nsfw" />
+          </Label>
+        </div>
+      )}
+
       <div className="w-full flex justify-between mt-1 items-center h-5">
         <div className="ml-1 flex gap-3">
           <input type="file" id="file" className="hidden" ref={uploaderRef} onChange={fileChanged} />