Update the 404 template and add a new generic error template

assets/css/style.css

@@ -1703,3 +1703,9 @@ a.tour-button.button-primary:hover {
 .webui-popover a {
 	color: #fff;
 }
+
+.error-template {
+	text-align: center;
+	margin: 0 auto;
+	padding: 7rem 0;
+}

gp-includes/route.php

@@ -31,9 +31,33 @@ public function __construct() {
 		add_action( 'gp_before_request', array( $this, 'check_uri_trailing_slash' ) );
 	}
 
-	public function die_with_error( $message, $status = 500 ) {
+	/**
+	 * Shows a template and exit.
+	 *
+	 * @param string      $message  The message to display.
+	 * @param int         $status   The HTTP status code.
+	 * @param string|null $title    The title of the page.
+	 * @param string      $template The template to use.
+	 *
+	 * @return void
+	 */
+	public function die_with_error( string $message, int $status = 500, ?string $title = null, string $template = 'error' ) {
+		if ( null === $title ) {
+			$title = esc_html__( 'Error', 'glotpress' );
+		}
 		$this->status_header( $status );
-		$this->exit_( $message );
+		if ( isset( $_SERVER['HTTP_X_REQUESTED_WITH'] ) && strtolower( $_SERVER['HTTP_X_REQUESTED_WITH'] ) == 'xmlhttprequest' ) {
+			$this->exit_( $message );
+		} else {
+			$this->tmpl(
+				$template,
+				array(
+					'title'   => $title,
+					'message' => $message,
+				)
+			);
+			$this->exit_();
+		}
 	}
 
 	public function before_request() {

gp-includes/routes/project.php

@@ -467,7 +467,7 @@ public function mass_create_sets_post( $project_path ) {
 		$other_project = GP::$project->get( gp_post( 'project_id' ) );
 
 		if ( ! $other_project ) {
-			return $this->die_with_error( __( 'Project wasn’found', 'glotpress' ) );
+			return $this->die_with_error( esc_html__( 'Project wasn’found', 'glotpress' ), 404, __esc_html__( 'Not found', 'glotpress' ), '404' );
 		}
 
 		$changes = $project->set_difference_from( $other_project );
@@ -518,7 +518,7 @@ public function mass_create_sets_preview_post( $project_path ) {
 		$other_project = GP::$project->get( gp_post( 'project_id' ) );
 
 		if ( ! $other_project ) {
-			return $this->die_with_error( __( 'Project wasn’found', 'glotpress' ) );
+			return $this->die_with_error( esc_html__( 'Project wasn’found', 'glotpress' ), 404, __esc_html__( 'Not found', 'glotpress' ), '404' );
 		}
 
 		header( 'Content-Type: application/json' );

gp-includes/routes/translation.php

@@ -733,7 +733,7 @@ private function edit_single_translation( $project_path, $locale_slug, $translat
 		$translation = GP::$translation->get( gp_post( 'translation_id' ) );
 
 		if ( ! $translation ) {
-			return $this->die_with_error( 'Translation doesn’t exist!' );
+			return $this->die_with_error( esc_html__( 'Translation doesn’t exist!', 'glotpress' ), 404, esc_html__( 'Not Found', 'glotpress' ), '404' );
 		}
 
 		$this->can_approve_translation_or_forbidden( $translation );
@@ -776,7 +776,7 @@ private function edit_single_translation( $project_path, $locale_slug, $translat
 	 */
 	private function discard_warning_edit_function( $project, $locale, $translation_set, $translation ) {
 		if ( ! isset( $translation->warnings[ gp_post( 'index' ) ][ gp_post( 'key' ) ] ) ) {
-			return $this->die_with_error( 'The warning doesn’exist!' );
+			return $this->die_with_error( esc_html__( 'The warning doesn’t exist!', 'glotpress' ), 404, esc_html__( 'Not Found', 'glotpress' ), '404' );
 		}
 
 		$warning = array(

gp-templates/404.php

@@ -1,7 +1,10 @@
 <?php
 gp_title( __( 'Not Found &lt; GlotPress', 'glotpress' ) );
 gp_tmpl_header();
-
-_e( 'Not Found', 'glotpress' );
-
+?>
+<div class="error-template">
+	<h2><?php esc_html_e( 'Not Found', 'glotpress' ); ?></h2>
+	<?php esc_html_e( 'The requested URL was not found on this server.', 'glotpress' ); ?>
+</div>
+<?php
 gp_tmpl_footer();

gp-templates/error.php

@@ -0,0 +1,18 @@
+<?php
+/**
+ * Template for errors.
+ */
+
+/** @var string $title */
+/** @var string $message */
+
+/* Translators: %s: title */
+gp_title( esc_html( sprintf( __( '%s &lt; GlotPress', 'glotpress' ), $title ? $title : esc_html__( 'Error', 'glotpress' ) ) ) );
+gp_tmpl_header();
+?>
+	<div class="error-template">
+		<h2><?php echo esc_html( $title ); ?></h2>
+		<?php echo esc_html( $message ); ?>
+	</div>
+<?php
+gp_tmpl_footer();