Change from elastic to meilisearch and aurora api

.jshintrc

@@ -1,32 +1,50 @@
 {
-	"bitwise": true,
+	"boss": true,
 	"curly": true,
 	"eqeqeq": true,
+	"eqnull": true,
 	"esversion": 11,
+	"expr": true,
+	"immed": true,
+	"noarg": true,
+	"nonbsp": true,
+	"onevar": true,
+	"quotmark": "single",
+	"trailing": true,
+	"undef": true,
+	"unused": true,
+
+	"browser": true,
+
+	"globals": {
+		"_": false,
+		"Backbone": false,
+		"jQuery": false,
+		"JSON": false,
+		"wp": false,
+		"export": false,
+		"module": false,
+		"require": false,
+		"WorkerGlobalScope": false,
+		"self": false,
+		"OffscreenCanvas": false,
+		"Promise": false
+	},
+	"bitwise": true,
 	"forin": false,
 	"freeze": true,
 	"futurehostile": true,
 	"latedef": "nofunc",
 	"leanswitch": true,
-	"noarg": true,
 	"nocomma": true,
-	"nonbsp": true,
 	"nonew": true,
 	"noreturnawait": true,
 	"predef": [
 		"tippy",
-		"lc_select",
 		"FullCalendar"
 	],
 	"shadow": false,
 	"singleGroups": false,
 	"trailingcomma": false,
-	"undef": true,
-	"unused": true,
-	"varstmt": true,
-
-	"boss": true,
-	"eqnull": true,
-
-	"browser": true
+	"varstmt": true
 }

admin/class-rotaract-appointments-admin.php

@@ -41,36 +41,34 @@ class Rotaract_Appointments_Admin {
 	private string $version;
 
 	/**
-	 * The version of the JavaScript dependency LC-select.
+	 * The version of the JavaScript dependency Instantsearch.
 	 *
-	 * @since    1.0.0
+	 * @since    3.0.0
 	 * @access   private
-	 * @var      string    $lc_select_version    The current version of lc_select.
+	 * @var      string    $instantsearch_version    The current version of Meilisearch.
 	 */
-	private string $lc_select_version = '1.1.7';
+	private string $instantsearch_version = '4.60.0';
 
 	/**
-	 * The Elasticsearch caller.
+	 * The version of the JavaScript dependency Meilisearch.
 	 *
-	 * @since    1.0.0
+	 * @since    3.0.0
 	 * @access   private
-	 * @var      Rotaract_Elastic_Caller $elastic_caller    The object that handles search calls to the Elasticsearch instance.
+	 * @var      string    $instant_meilisearch_version    The current version of Meilisearch.
 	 */
-	private Rotaract_Elastic_Caller $elastic_caller;
+	private string $instant_meilisearch_version = '0.13.6';
 
 	/**
 	 * Initialize the class and set its properties.
 	 *
 	 * @param    string                  $rotaract_appointments The name of this plugin.
 	 * @param    string                  $version     The version of this plugin.
-	 * @param    Rotaract_Elastic_Caller $elastic_caller Elasticsearch call handler.
 	 * @since    1.0.0
 	 */
-	public function __construct( string $rotaract_appointments, string $version, Rotaract_Elastic_Caller $elastic_caller ) {
+	public function __construct( string $rotaract_appointments, string $version ) {
 
 		$this->rotaract_appointments = $rotaract_appointments;
 		$this->version               = $version;
-		$this->elastic_caller        = $elastic_caller;
 	}
 
 	/**
@@ -81,7 +79,6 @@ public function __construct( string $rotaract_appointments, string $version, Rot
 	public function enqueue_styles() {
 
 		wp_enqueue_style( '$this->rotaract_appointments', plugins_url( 'css/admin.css', __FILE__ ), array(), $this->version, 'all' );
-		wp_enqueue_style( 'lc-select-light', plugins_url( 'node_modules/lc-select/themes/light.css', __DIR__ ), array(), $this->lc_select_version, 'all' );
 	}
 
 	/**
@@ -91,22 +88,11 @@ public function enqueue_styles() {
 	 */
 	public function enqueue_scripts() {
 
-		// Including the lc_select script in footer results in broken owner selection in appointments submenu page.
-		wp_enqueue_script( 'lc-select', plugins_url( 'node_modules/lc-select/lc_select.min.js', __DIR__ ), array(), $this->lc_select_version, true );
+		// Including the Meilisearch script in footer results in broken owner selection in appointments submenu page.
+		wp_enqueue_script( 'instantsearch', plugins_url( 'node_modules/instantsearch.js/dist/instantsearch.production.min.js', __DIR__ ), array(), $this->instantsearch_version, true );
+		wp_enqueue_script( 'instant-meilisearch', plugins_url( 'node_modules/@meilisearch/instant-meilisearch/dist/instant-meilisearch.umd.min.js', __DIR__ ), array( 'instantsearch' ), $this->instant_meilisearch_version, true );
 
-		wp_enqueue_script( $this->rotaract_appointments, plugins_url( 'js/settings.js', __FILE__ ), array( 'lc-select' ), $this->version, true );
-		wp_localize_script(
-			$this->rotaract_appointments,
-			'lcData',
-			array(
-				'labels' => array(
-					esc_attr__( 'Search', 'rotaract-appointments' ),
-					esc_attr__( 'Add', 'rotaract-appointments' ),
-					esc_attr__( 'Select', 'rotaract-appointments' ),
-					esc_attr__( 'Nothing found.', 'rotaract-appointments' ),
-				),
-			)
-		);
+		wp_enqueue_script( $this->rotaract_appointments, plugins_url( 'js/settings.js', __FILE__ ), array( 'instantsearch', 'instant-meilisearch' ), $this->version, true );
 	}
 
 	/**
@@ -122,11 +108,11 @@ private function get_partial( string $filename ): string {
 	}
 
 	/**
-	 * HTML notice that elasticsearch configuration is missing.
+	 * HTML notice that meilisearch configuration is missing.
 	 */
-	public function elastic_missing_notice() {
+	public function meilisearch_missing_notice() {
 
-		include $this->get_partial( 'notice-elastic-missing.php' );
+		include $this->get_partial( 'notice-meilisearch-missing.php' );
 	}
 
 	/**
@@ -281,13 +267,13 @@ public function appointment_owners_field( array $args ) { // phpcs:ignore
 	/**
 	 * Builds select tag containing grouped appointment options.
 	 *
-	 * @param bool        $is_new True if this intends to be a new owner.
 	 * @param int         $index Index of the parameter.
 	 * @param string|null $owner_name The owner's name.
+	 * @param string|null $owner_slug The owner's slug.
+	 * @param string|null $owner_type The owner's type.
 	 * @param string|null $owner_color Selected color.
 	 */
-	private function print_appointment_owners_line( bool $is_new, int $index, string $owner_name = null, string $owner_color = null ) { // phpcs:ignore
-		$owners        = $this->elastic_caller->get_all_owners();
+	private function print_appointment_owners_line( bool $is_prototype, int $index = -1, string $owner_name = null, string $owner_slug = null, string $owner_type = null, string $owner_color = null ) {
 		$color_palette = $this->get_palette();
 
 		include $this->get_partial( 'field-appointment-owner.php' );
@@ -310,8 +296,8 @@ public function appointment_ics_field( array $args ) { // phpcs:ignore
 	 *
 	 * @param bool        $is_new True if this intends to be a new owner.
 	 * @param int         $index Index of the parameter.
-	 * @param string|null $feed_name The feed's name.
-	 * @param string|null $feed_url The feed's url.
+	 * @param string|null $feed_name The owner's name.
+	 * @param string|null $feed_url The ICS URL.
 	 * @param string|null $feed_color Selected color.
 	 */
 	private function print_ics_line( bool $is_new, int $index, string $feed_name = null, string $feed_url = null, string $feed_color = null ) { // phpcs:ignore
@@ -331,14 +317,18 @@ public function sanitize_rotaract_appointment_owners( ?array $input ): array {
 		$new_input = array();
 		// Re-indexing the array.
 		foreach ( $input as $owner ) {
-			$name  = sanitize_text_field( $owner['name'] );
-			$color = sanitize_hex_color( $owner['color'] );
-			if ( empty( $name ) || empty( $color ) ) {
+			$name         = sanitize_text_field( $owner['name'] );
+			$type         = sanitize_text_field( $owner['type'] );
+			$slug = sanitize_text_field( $owner['slug'] );
+			$color        = sanitize_hex_color( $owner['color'] );
+			if ( empty( $name ) || empty( $type ) || empty( $slug ) || empty( $color ) ) {
 				continue;
 			}
 			$new_input[] = array(
-				'name'  => $name,
-				'color' => $color,
+				'name'         => $name,
+				'type'         => $type,
+				'slug' => $slug,
+				'color'        => $color,
 			);
 		}
 		return array_values( $new_input );

admin/css/admin.css

@@ -1,3 +1,7 @@
+.prototype {
+	display: none !important;
+}
+
 .button .dashicons {
 	line-height: 1.5em;
 }
@@ -33,6 +37,64 @@
 	padding: 1rem;
 }
 
-select.lc-select {
-	min-width: 150px;
+.modal-bg {
+	display: none;
+	background-color: rgba(0, 0, 0, 0.2);
+	padding: 4rem 1rem;
+	position: fixed;
+	bottom: 0;
+	left: 0;
+	right: 0;
+	top: 0;
+	overflow: scroll;
+}
+.modal-bg.show {
+	display: block;
+}
+
+.modal-bg .modal {
+	background-color: #ffffff;
+	border-radius: 0.5rem;
+	margin: 0 auto;
+	max-width: 480px;
+	padding: 1rem;
+}
+
+#searchbox > .button {
+	margin-left: 1rem;
+}
+#searchbox, .ais-SearchBox-form {
+	display: flex;
+    align-items: stretch;
+}
+.ais-SearchBox, .ais-SearchBox-form .ais-SearchBox-input {
+	border-bottom-right-radius: 0;
+	border-top-right-radius: 0;
+	flex-grow: 1;
+	margin: 0;
+}
+.ais-SearchBox-form .button {
+	border-bottom-left-radius: 0;
+	border-top-left-radius: 0;
+}
+.button-primary .ais-SearchBox-submitIcon {
+	fill: #ffffff;
+}
+
+#hits .ais-Hits-list {
+	margin: 1rem 0;
+}
+#hits .ais-Hits-item {
+	border-top: solid 1px #cccccc;
+	list-style-type: none;
+	margin: 0;
+}
+#hits .ais-Hits-item .button.list-btn {
+	display: inline-block;
+	background: none;
+	border: none;
+	border-radius: 0;
+	padding: 0.25rem 1rem;
+	width: 100%;
+    text-align: start;
 }