Fix: Use minHeight.

Temporary change: Prevent TextFile from loading large content.
Fixes #1: File preview failing with JSON files.
Add a way to open text files in new tab.

lang @ ce5e32d4

-Subproject commit 8191f8301732d2863bb100a8839862c7d92294c3
+Subproject commit ce5e32d444a35a691ac6b0abfbc722945e7cdf46

src/components/common/messaging/attachments/Attachment.module.scss

@@ -111,16 +111,16 @@
 
 .actions.imageAction {
     grid-template: 
-        "name icon download" auto
-        "size icon download" auto
+        "name icon external download" auto
+        "size icon external download" auto
         / minmax(20px, 1fr) min-content min-content;
 }
 
 .actions {
     display: grid;
     grid-template: 
-        "icon name download" auto
-        "icon size download" auto
+        "icon name external download" auto
+        "icon size external download" auto
         / min-content minmax(20px, 1fr) min-content;
 
     align-items: center;
@@ -150,6 +150,10 @@
         grid-area: download;
     }
 
+    .externalType {
+        grid-area: external;
+    }
+
     .iconType {
         grid-area: icon;
     }

src/components/common/messaging/attachments/AttachmentActions.tsx

@@ -100,6 +100,14 @@ export default function AttachmentActions({ attachment }: Props) {
                     <File size={24} className={styles.iconType} />
                     <span className={styles.filename}>{filename}</span>
                     <span className={styles.filesize}>{filesize}</span>
+                    { metadata.type === 'Text' && <a
+                        href={open_url}
+                        target="_blank"
+                        className={styles.externalType}>
+                        <IconButton>
+                            <LinkExternal size={24} />
+                        </IconButton>
+                    </a> }
                     <a
                         href={download_url}
                         className={styles.downloadIcon}

src/components/common/messaging/attachments/TextFile.tsx

@@ -29,6 +29,12 @@ export default function TextFile({ attachment }: Props) {
     useEffect(() => {
         if (typeof content !== "undefined") return;
         if (loading) return;
+
+        if (attachment.size > 20_000) {
+            setContent('This file is > 20 KB, for your sake I did not load it.\nSee tracking issue here for previews: https://gitlab.insrt.uk/revolt/revite/-/issues/2');
+            return;
+        }
+
         setLoading(true);
 
         let cached = fileCache[attachment._id];
@@ -37,7 +43,7 @@ export default function TextFile({ attachment }: Props) {
             setLoading(false);
         } else {
             axios
-                .get(url)
+                .get(url, { transformResponse: [] })
                 .then((res) => {
                     setContent(res.data);
                     fileCache[attachment._id] = res.data;

src/lib/TextAreaAutoSize.tsx

@@ -131,7 +131,7 @@ export default function TextAreaAutoSize(props: TextAreaAutoSizeProps) {
                 ref={ref}
                 value={value}
                 padding={padding}
-                style={{ height: minHeight }}
+                style={{ minHeight }}
                 hideBorder={hideBorder}
                 lineHeight={lineHeight}
                 onChange={(ev) => {