htaccess for Nextjs Website not handling 404 Correctly

Question

I'm currently running a Nextjs website through GreenGeeks Apache Servers and have to provide a htaccess file to handle rewrites/routing. Up until now, in production, all invalid links went to my custom 404 page located in /app/not-found.js - Now they all open a page that says 'Internal Server Error' except for when I specifically go to /404.

In development, all works fine and my custom 404 page is displayed on any invalid URL.

Here is my htaccess file

<IfModule mod_rewrite.c>
RewriteEngine on
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.html [L]
ErrorDocument 404 %{DOCUMENT_ROOT}/app/not-found.js
</IfModule>

I am new to Apache hosting and have tried a couple variations of the htaccess file but often it causes the site as a whole to return a 404 (not my custom page).