Define theme setting for Google Maps API key

** Why are these changes being introduced:

* We received a bug report for having the Google Maps API key in our
repository as a security vulnerability.

** Relevant ticket(s):

* https://mitlibraries.atlassian.net/browse/pw-172

** How does this address that need:

* While we disagree that this represents a security vulnerability - the
key is sent to all website users in order to load map assets - there is
also no need to handle the key directly in our source code. This defines
a theme settings field that will store this key going forward, which
will also allow us to rotate the key more easily without a code change.

* The access granted to our maps key has also been restricted, which
results in less ability for users to spot the key (as happened here)
and then probe its ability for related APIs that are not needed but
were inadvertently authorized.

** Document any side effects to this change:

* It is marginally easier for non-developers to manage this key now.

Author: matt-bernhardt

web/app/themes/mitlib-parent/functions.php

@@ -27,6 +27,15 @@
  */
 require_once( 'lib/news.php' );
 
+/**
+ * The theme relies upon an external provider (Google) to provide the map
+ * tiles for the map of our locations. That integration is requires a key which
+ * is managed on a dedicated dashboard.
+ */
+require_once( 'src/class-maps.php' );
+add_action( 'admin_init', array( 'Mitlib\Parent\Maps', 'settings' ) );
+add_action( 'admin_menu', array( 'Mitlib\Parent\Maps', 'init' ) );
+
 /**
  * Define custom query params. Right now this is just the `v` parameter used by
  * the map template.
@@ -177,7 +186,7 @@ function setup_scripts_styles() {
 
 	wp_register_script( 'gldatepickerJS', get_template_directory_uri() . '/libs/datepicker/glDatePicker.min.js', array(), '2.0', true );
 
-	wp_register_script( 'googleMapsAPI', '//maps.googleapis.com/maps/api/js?key=AIzaSyDJg6fTKm3Pa_NfKEVAdyeRUbVs7zZm5Nw', array(), '1.7.0', true );
+	wp_register_script( 'googleMapsAPI', '//maps.googleapis.com/maps/api/js?key=' . get_option( 'google_maps_key' ), array(), '1.7.0', true );
 
 	wp_register_script( 'jquery-cookie', get_template_directory_uri() . '/js/libs/jquery.cookie/jquery.cookie.js', array(), '1.3', true );
 

web/app/themes/mitlib-parent/src/class-maps.php

@@ -0,0 +1,132 @@
+<?php
+/**
+ * Class that defines a theme settings dashboard for a Google Maps integration.
+ * This includes both the page and individual setting field.
+ *
+ * @package MITlib_Parent
+ * @since 0.8
+ */
+
+namespace Mitlib\Parent;
+
+/**
+ * Defines settings dashboard for maps integration. This class gets loaded and
+ * hooked into from the theme's functions.php file.
+ */
+class Maps {
+	/**
+	 * The required permission to access the admin page.
+	 */
+	const PERMS = 'manage_options';
+
+	/**
+	 * This defines the admin page which holds the settings management form.
+	 */
+	public static function init() {
+		if ( current_user_can( self::PERMS ) ) {
+			add_options_page(
+				'Maps',
+				'Map',
+				self::PERMS,
+				'mitlib-maps-dashboard',
+				array( 'Mitlib\Parent\Maps', 'dashboard' )
+			);
+		}
+	}
+
+	/**
+	 * This defines the content displayed on the admin page. It also receives the
+	 * submission of the web form on that page, and calls the update action when
+	 * needed.
+	 */
+	public static function dashboard() {
+		// Confirm user capabilities before doing anything.
+		if ( ! current_user_can( self::PERMS ) ) {
+			return;
+		}
+
+		// If the form has been posted, the update method handles that.
+		$action = filter_input( INPUT_POST, 'action' );
+		if ( ! empty( $action ) ) {
+			self::update();
+		}
+
+		// Finally, we render the form itself.
+		echo '<div class="wrap">';
+		echo '<h1>Maps settings</h1>';
+		echo '<p>This form will update the Google Maps API key which grants us access to use their map assets on our locations page.</p>';
+		echo '<p>This key is managed by the web-lib@mit.edu user as part of the <a href="https://console.cloud.google.com/apis/credentials?project=api-project-260287310852">Google Cloud Platform</a>.</p>';
+		echo '<form method="post" action="">';
+		wp_nonce_field( 'custom_nonce_action', 'custom_nonce_field' );
+		settings_fields( 'mitlib_parent_maps' );
+		do_settings_sections( 'mitlib-maps-dashboard' );
+		submit_button( 'Update maps settings' );
+		echo '</form>';
+		echo '</div>';
+	}
+
+	/**
+	 * This is the general descriptive statement at the top of the settings form.
+	 * We don't use this, but the method needs to exist.
+	 */
+	public static function general() {
+		echo '';
+	}
+
+	/**
+	 * Field rendering callback for the Google Maps key setting.
+	 */
+	public static function google_maps_key_callback() {
+		$google_maps_key = get_option( 'google_maps_key' );
+		echo '<input type="text" name="google_maps_key" value="' . esc_attr( $google_maps_key ) . '" id="google_maps_key" size="60">';
+	}
+
+	/**
+	 * Register the setting field which holds the Google maps key. This includes
+	 * creating a section, which is a bit overkill for only one setting, but here
+	 * we are.
+	 */
+	public static function settings() {
+		register_setting( 'mitlib_parent_maps', 'google_maps_key' );
+
+		add_settings_section(
+			'mitlib_parent_maps_general',
+			'General settings',
+			array( 'Mitlib\Parent\Maps', 'general' ),
+			'mitlib-maps-dashboard'
+		);
+
+		add_settings_field(
+			'google_maps_key',
+			'Google Maps API key',
+			array( 'Mitlib\Parent\Maps', 'google_maps_key_callback' ),
+			'mitlib-maps-dashboard',
+			'mitlib_parent_maps_general',
+			array(
+				'label_for' => 'google_maps_key',
+				'class' => 'mitlib_maps_row',
+			)
+		);
+	}
+
+	/**
+	 * Update setting based on posted form information.
+	 */
+	public static function update() {
+		check_admin_referer( 'custom_nonce_action', 'custom_nonce_field' );
+
+		if ( 'update' == filter_input( INPUT_POST, 'action' ) ) {
+			$google_maps_key = '';
+
+			if ( filter_input( INPUT_POST, 'google_maps_key' ) ) {
+				$google_maps_key = sanitize_text_field(
+					wp_unslash( filter_input( INPUT_POST, 'google_maps_key' ) )
+				);
+			}
+
+			update_option( 'google_maps_key', $google_maps_key );
+		}
+
+		echo( '<div class="updated"><p>The maps settings have been updated.</p></div>' );
+	}
+}