refactor: format and lint codebase (#971)

app/assets/javascripts/Components/Files/FilePreviewInfoPanel.tsx

@@ -0,0 +1,35 @@
+import { formatSizeToReadableString } from '@standardnotes/filepicker'
+import { SNFile } from '@standardnotes/snjs'
+import { FunctionComponent } from 'preact'
+import { Icon } from '@/Components/Icon'
+
+type Props = {
+  file: SNFile
+}
+
+export const FilePreviewInfoPanel: FunctionComponent<Props> = ({ file }) => {
+  return (
+    <div className="flex flex-col min-w-70 p-4 border-0 border-l-1px border-solid border-main">
+      <div className="flex items-center mb-4">
+        <Icon type="info" className="mr-2" />
+        <div className="font-semibold">File information</div>
+      </div>
+      <div className="mb-3">
+        <span className="font-semibold">Type:</span> {file.mimeType}
+      </div>
+      <div className="mb-3">
+        <span className="font-semibold">Size:</span> {formatSizeToReadableString(file.size)}
+      </div>
+      <div className="mb-3">
+        <span className="font-semibold">Created:</span> {file.created_at.toLocaleString()}
+      </div>
+      <div className="mb-3">
+        <span className="font-semibold">Last Modified:</span>{' '}
+        {file.userModifiedDate.toLocaleString()}
+      </div>
+      <div>
+        <span className="font-semibold">File ID:</span> {file.uuid}
+      </div>
+    </div>
+  )
+}