diff --git a/resources/js/clients/statements/view.js b/resources/js/clients/statements/view.js
new file mode 100644
index 000000000000..929ca0251051
--- /dev/null
+++ b/resources/js/clients/statements/view.js
@@ -0,0 +1,86 @@
+/**
+ * Invoice Ninja (https://invoiceninja.com).
+ *
+ * @link https://github.com/invoiceninja/invoiceninja source repository
+ *
+ * @copyright Copyright (c) 2021. Invoice Ninja LLC (https://invoiceninja.com)
+ *
+ * @license https://www.elastic.co/licensing/elastic-license
+ */
+
+class Statement {
+    constructor() {
+        this.url = new URL(
+            document.querySelector('meta[name=pdf-url]').content
+        );
+        this.startDate = '';
+        this.endDate = '';
+        this.showPaymentsTable = false;
+        this.showAgingTable = false;
+    }
+
+    bindEventListeners() {
+        [
+            '#date-from',
+            '#date-to',
+            '#show-payments-table',
+            '#show-aging-table',
+        ].forEach((selector) => {
+            document
+                .querySelector(selector)
+                .addEventListener('change', (event) =>
+                    this.handleValueChange(event)
+                );
+        });
+    }
+
+    handleValueChange(event) {
+        if (event.target.type === 'checkbox') {
+            this[event.target.dataset.field] = event.target.checked;
+        } else {
+            this[event.target.dataset.field] = event.target.value;
+        }
+
+        this.updatePdf();
+    }
+
+    get composedUrl() {
+        this.url.search = '';
+
+        if (this.startDate.length > 0) {
+            this.url.searchParams.append('start_date', this.startDate);
+        }
+
+        if (this.endDate.length > 0) {
+            this.url.searchParams.append('end_date', this.endDate);
+        }
+
+        this.url.searchParams.append(
+            'show_payments_table',
+            +this.showPaymentsTable
+        );
+        this.url.searchParams.append('show_aging_table', +this.showAgingTable);
+
+        return this.url.href;
+    }
+
+    updatePdf() {
+        document.querySelector('meta[name=pdf-url]').content = this.composedUrl;
+
+        let iframe = document.querySelector('#pdf-iframe');
+
+        if (iframe) {
+            iframe.src = this.composedUrl;
+        }
+
+        document
+            .querySelector('meta[name=pdf-url]')
+            .dispatchEvent(new Event('change'));
+    }
+
+    handle() {
+        this.bindEventListeners();
+    }
+}
+
+new Statement().handle();
diff --git a/resources/views/portal/ninja2020/statement/index.blade.php b/resources/views/portal/ninja2020/statement/index.blade.php
index ebfd9636efbe..0bf05caaf4c4 100644
--- a/resources/views/portal/ninja2020/statement/index.blade.php
+++ b/resources/views/portal/ninja2020/statement/index.blade.php
@@ -38,71 +38,5 @@
 @endsection
 
 @push('footer')
-    <script>
-        class Statement {
-            constructor() {
-                this.url = new URL(document.querySelector('meta[name=pdf-url]').content);
-                this.startDate = '';
-                this.endDate = '';
-                this.showPaymentsTable = false;
-                this.showAgingTable = false;
-            }
-
-            bindEventListeners() {
-                ['#date-from', '#date-to', '#show-payments-table', '#show-aging-table'].forEach(selector => {
-                    document
-                        .querySelector(selector)
-                        .addEventListener('change', (event) => this.handleValueChange(event));
-                });
-            }
-
-            handleValueChange(event) {
-                if (event.target.type === 'checkbox') {
-                    console.log(1);
-                    this[event.target.dataset.field] = event.target.checked;
-                } else {
-                    this[event.target.dataset.field] = event.target.value;
-                }
-
-                this.updatePdf();
-            }
-
-            get composedUrl() {
-                this.url.search = '';
-
-                if (this.startDate.length > 0) {
-                    this.url.searchParams.append('start_date', this.startDate);
-                }
-
-                if (this.endDate.length > 0) {
-                    this.url.searchParams.append('end_date', this.endDate);
-                }
-
-                this.url.searchParams.append('show_payments_table', +this.showPaymentsTable);
-                this.url.searchParams.append('show_aging_table', +this.showAgingTable);
-
-                return this.url.href;
-            }
-
-            updatePdf() {
-                document
-                    .querySelector('meta[name=pdf-url]')
-                    .content = this.composedUrl;
-
-                let iframe = document.querySelector('#pdf-iframe');
-
-                if (iframe) {
-                    iframe.src = this.composedUrl;
-                }
-
-                document.querySelector('meta[name=pdf-url]').dispatchEvent(new Event('change'));
-            }
-
-            handle() {
-                this.bindEventListeners();
-            }
-        }
-
-        new Statement().handle();
-    </script>
+    <script src="{{ asset('js/clients/statements/view.js') }}"></script>
 @endpush
\ No newline at end of file