expose MaxUploadSize site setting to the client as QPixel.MAX_UPLOAD_SIZE

Author: Oaphi

app/views/layouts/_expose.html.erb

@@ -0,0 +1,21 @@
+<script type="application/javascript">
+  window.QPixel ||= {};
+
+  Object.defineProperty(QPixel, 'ALLOWED_POST_ATTRS', {
+    configurable: false,
+    value: Object.freeze(<%= raw PostsHelper::PostScrubber::ALLOWED_ATTRS %>),
+    writable: false,
+  });
+
+  Object.defineProperty(QPixel, 'ALLOWED_POST_TAGS', {
+    configurable: false,
+    value: Object.freeze(<%= raw PostsHelper::PostScrubber::ALLOWED_TAGS %>),
+    writable: false,
+  });
+
+  Object.defineProperty(QPixel, 'MAX_UPLOAD_SIZE', {
+    configurable: false,
+    value: "<%= SiteSetting['MaxUploadSize'] || '2MB' %>",
+    writable: false,
+  });
+</script>

app/views/layouts/_head.html.erb

@@ -46,21 +46,7 @@
 <%= javascript_include_tag 'application' %>
 <script src="https://cdn.jsdelivr.net/npm/@codidact/co-design@latest/js/co-design.js" defer></script>
 
-<script type="application/javascript">
-  window.QPixel ||= {};
-
-  Object.defineProperty(QPixel, 'ALLOWED_POST_ATTRS', {
-    configurable: false,
-    value: Object.freeze(<%= raw PostsHelper::PostScrubber::ALLOWED_ATTRS %>),
-    writable: false,
-  });
-
-  Object.defineProperty(QPixel, 'ALLOWED_POST_TAGS', {
-    configurable: false,
-    value: Object.freeze(<%= raw PostsHelper::PostScrubber::ALLOWED_TAGS %>),
-    writable: false,
-  });
-</script>
+<%= render 'layouts/expose' %>
 
 <% if SiteSetting['SyntaxHighlightingEnabled'] %>
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.0.1/styles/default.min.css">

global.d.ts

@@ -386,6 +386,10 @@ interface QPixel {
    * List of attributes allowed on HTML tags in posts, supplied by the server
    */
   readonly ALLOWED_POST_ATTRS?: readonly string[]
+  /**
+   * Maximum file upload size (arbitrary unit)
+   */
+  readonly MAX_UPLOAD_SIZE?: string
 
   // private properties
   _filters?: Record<string, QPixelFilter> | null;