Merge pull request #107 from Emilia-Capital/filip/expand-page-select

Add radios in page-settings
Emilia-Capital · Nov 6, 2024 · 841967b · 841967b
2 parents 2777f88 + 9dc357f
commit 841967b
Show file tree

Hide file tree

Showing 8 changed files with 335 additions and 144 deletions.
diff --git a/assets/css/settings-page.css b/assets/css/settings-page.css
@@ -27,7 +27,8 @@
 		border-bottom: 1px solid var(--prpl-color-gray-2);
 		padding-bottom: 1rem;
 
-		.item-actions {
+		.item-actions,
+		.prpl-select-page {
 			display: flex;
 			gap: 1rem;
 		}
@@ -54,6 +55,10 @@
 		&:last-child {
 			border-bottom: none;
 		}
+
+		.radios {
+			margin-bottom: 1rem;
+		}
 	}
 
 	#prpl-settings-submit {
@@ -81,4 +86,9 @@
 		flex-direction: column;
 		gap: 1rem;
 	}
+
+	.radios {
+		display: flex;
+		gap: 1rem;
+	}
 }
diff --git a/assets/js/settings-page.js b/assets/js/settings-page.js
@@ -21,7 +21,7 @@ const prplDocumentReady = function ( fn ) {
  */
 const prplToggleEditActionVisibility = function ( page ) {
 	const itemActionsEl = document.querySelector(
-		`.item-actions[data-page="${ page }"]`
+		`.prpl-pages-item[data-page-item="${ page }"] .item-actions`
 	);
 	if ( ! itemActionsEl ) {
 		return;
@@ -41,6 +41,111 @@ const prplToggleEditActionVisibility = function ( page ) {
 	}
 };
 
+/**
+ * Handle showing/hiding the edit action,
+ * based on whether a page is selected.
+ * Also changes the link of the edit action.
+ */
+prplDocumentReady( function () {
+	document.querySelectorAll( 'select' ).forEach( function ( select ) {
+		const page = select
+			.closest( '.prpl-pages-item' )
+			.getAttribute( 'data-page-item' );
+
+		prplToggleEditActionVisibility( page );
+		if ( select ) {
+			select.addEventListener( 'change', function () {
+				prplToggleEditActionVisibility( page );
+			} );
+		}
+	} );
+} );
+
+const prplTogglePageSelectorSettingVisibility = function ( page, value ) {
+	const itemActionsWrapperEl = document.querySelector(
+		`.prpl-pages-item-${ page } .item-actions`
+	);
+
+	if ( ! itemActionsWrapperEl ) {
+		return;
+	}
+
+	// Hide entire page selector setting if needed.
+	if ( 'not-applicable' === value ) {
+		// Hide actions wrapper.
+		itemActionsWrapperEl.style.display = 'none';
+
+		// Clear the <select> element value.
+		itemActionsWrapperEl.querySelector( 'select' ).value = '';
+
+		// Hide edit button.
+		itemActionsWrapperEl.querySelector(
+			'[data-action="edit"]'
+		).style.display = 'none';
+	}
+
+	// Show only create button.
+	if ( 'no' === value ) {
+		// Show actions wrapper.
+		itemActionsWrapperEl.style.display = 'flex';
+
+		// Clear the <select> element value.
+		itemActionsWrapperEl.querySelector( 'select' ).value = '';
+
+		// Hide edit button.
+		itemActionsWrapperEl.querySelector(
+			'[data-action="edit"]'
+		).style.display = 'none';
+
+		// Hide <select> and Edit wrapper.
+		itemActionsWrapperEl.querySelector(
+			'.prpl-select-page'
+		).style.display = 'none';
+
+		// Show create button.
+		itemActionsWrapperEl.querySelector(
+			'[data-action="create"]'
+		).style.display = 'block';
+	}
+
+	// Show only select and edit button.
+	if ( 'yes' === value ) {
+		// Show actions wrapper.
+		itemActionsWrapperEl.style.display = 'flex';
+
+		// Show <select> and Edit wrapper.
+		itemActionsWrapperEl.querySelector(
+			'.prpl-select-page'
+		).style.display = 'flex';
+
+		// Hide create button.
+		itemActionsWrapperEl.querySelector(
+			'[data-action="create"]'
+		).style.display = 'none';
+	}
+};
+
+prplDocumentReady( function () {
+	document
+		.querySelectorAll( 'input[type="radio"][data-page]' )
+		.forEach( function ( radio ) {
+			const page = radio.getAttribute( 'data-page' ),
+				value = radio.value;
+
+			if ( radio ) {
+				// Show/hide the page selector setting if radio is checked.
+				if ( radio.checked ) {
+					prplTogglePageSelectorSettingVisibility( page, value );
+				}
+
+				// Add listeners for all radio buttons.
+				radio.addEventListener( 'change', function () {
+					prplTogglePageSelectorSettingVisibility( page, value );
+				} );
+			}
+		} );
+} );
+
 /**
  * Handle the form submission.
  */
@@ -66,22 +171,3 @@ prplDocumentReady( function () {
 			} );
 		} );
 } );
-
-/**
- * Handle showing/hiding the edit action,
- * based on whether a page is selected.
- * Also changes the link of the edit action.
- */
-prplDocumentReady( function () {
-	document.querySelectorAll( 'select' ).forEach( function ( select ) {
-		const page =
-			select.parentElement.parentElement.getAttribute( 'data-page' );
-
-		prplToggleEditActionVisibility( page );
-		if ( select ) {
-			select.addEventListener( 'change', function () {
-				prplToggleEditActionVisibility( page );
-			} );
-		}
-	} );
-} );
diff --git a/classes/admin/class-page-settings.php b/classes/admin/class-page-settings.php
@@ -51,56 +51,29 @@ public function add_admin_page_content() {
 	}
 
 	/**
-	 * Get an array of tabs and their settings.
+	 * Get an array of settings.
 	 *
 	 * @return array
 	 */
-	public function get_tabs_settings() {
-		$page_types = \progress_planner()->get_page_types()->get_page_types();
-
-		foreach ( $page_types as $page_type ) {
-			$type_pages = \progress_planner()->get_page_types()->get_posts_by_type( 'any', $page_type['slug'] );
-
-			$tabs[ "page-{$page_type['slug']}" ] = [
-				'title'    => sprintf(
-					/* translators: The page name. */
-					esc_html__( 'Your pages: "%s" page', 'progress-planner' ),
-					esc_html( $page_type['title'] )
-				),
-				'desc'     => $page_type['description'] ?? '',
-				'intro'    => esc_html__( 'Let\'s determine your needs together.', 'progress-planner' ),
-				'settings' => [
-					"has-page-{$page_type['slug']}" => [
-						'id'          => "has-page-{$page_type['slug']}",
-						'label'       => sprintf(
-							/* translators: The page name. */
-							esc_html__( 'Do your site have the "%s" page?', 'progress-planner' ),
-							esc_html( $page_type['title'] )
-						),
-						'description' => esc_html__( 'If you don\'t have this page yet, we can help you create it.', 'progress-planner' ),
-						'type'        => 'radio',
-						'options'     => [
-							'no'  => esc_html__( 'No', 'progress-planner' ),
-							'yes' => esc_html__( 'Yes', 'progress-planner' ),
-						],
-						'value'       => empty( $type_pages ) ? 'no' : 'yes',
-						'page'        => $page_type['slug'],
-					],
-					$page_type['slug']              => [
-						'id'          => $page_type['slug'],
-						'title'       => $page_type['title'],
-						'description' => $page_type['description'] ?? '',
-						'type'        => 'page-select',
-						'value'       => empty( $type_pages ) ? 0 : $type_pages[0]->ID,
-						'page'        => $page_type['slug'],
-					],
-				],
+	public function get_settings() {
+		$settings = [];
+		foreach ( \progress_planner()->get_page_types()->get_page_types() as $page_type ) {
+			$value = '_no_page_needed';
+			if ( \progress_planner()->get_page_types()->is_page_needed( $page_type['slug'] ) ) {
+				$type_pages = \progress_planner()->get_page_types()->get_posts_by_type( 'any', $page_type['slug'] );
+				$value      = empty( $type_pages ) ? 0 : $type_pages[0]->ID;
+			}
+			$settings[ $page_type['slug'] ] = [
+				'id'          => $page_type['slug'],
+				'title'       => $page_type['title'],
+				'description' => $page_type['description'] ?? '',
+				'type'        => 'page-select',
+				'value'       => $value,
+				'page'        => $page_type['slug'],
 			];
 		}
 
-		$tabs = apply_filters( 'progress_planner_settings_page_tabs', $tabs );
-
-		return $tabs;
+		return apply_filters( 'progress_planner_settings', $settings );
 	}
 
 	/**
@@ -114,6 +87,17 @@ public function store_settings_form_options() {
 
 		if ( isset( $_POST['pages'] ) ) {
 			foreach ( wp_unslash( $_POST['pages'] ) as $type => $page_args ) { // phpcs:ignore WordPress.Security.ValidatedSanitizedInput.InputNotSanitized
+
+				$need_page = \sanitize_text_field( \wp_unslash( $page_args['have_page'] ) );
+
+				// Add the no-page-needed flag if it doesn't exist.
+				if ( 'not-applicable' === $need_page ) {
+					\progress_planner()->get_page_types()->add_no_type_needed( $type );
+				} else {
+					// Remove the no-page-needed flag if it exists.
+					\progress_planner()->get_page_types()->remove_no_type_needed( $type );
+				}
+
 				// Remove the post-meta from the existing posts.
 				$existing_posts = \progress_planner()->get_page_types()->get_posts_by_type( 'any', $type );
 				foreach ( $existing_posts as $post ) {

diff --git a/classes/class-page-types.php b/classes/class-page-types.php
@@ -75,6 +75,7 @@ public function create_taxonomy() {
 	 */
 	public function maybe_add_terms() {
 		$lessons = \progress_planner()->get_lessons()->get_items();
+
 		foreach ( $lessons as $lesson ) {
 			if ( \term_exists( $lesson['settings']['id'], self::TAXONOMY_NAME ) ) {
 				continue;
@@ -152,6 +153,7 @@ public function maybe_update_terms() {
 	 * @return array
 	 */
 	public function get_page_types() {
+
 		$terms = \get_terms(
 			[
 				'taxonomy'   => self::TAXONOMY_NAME,
@@ -383,4 +385,80 @@ public function assign_child_pages( $post_id, $term_id ) {
 			\wp_set_object_terms( $child->ID, $term_id, self::TAXONOMY_NAME );
 		}
 	}
+
+	/**
+	 * Get the term for when no page is needed.
+	 *
+	 * @param string $type The type.
+	 *
+	 * @return \WP_Term|false
+	 */
+	public function get_term_by_type( $type ) {
+		$no_type_needed_term = \get_term_by( 'slug', $type, self::TAXONOMY_NAME );
+		return $no_type_needed_term instanceof \WP_Term ? $no_type_needed_term : false;
+	}
+
+	/**
+	 * Check if a page is needed for a type.
+	 *
+	 * @param string $type The type.
+	 *
+	 * @return bool
+	 */
+	public function is_page_needed( $type ) {
+		$no_type_needed_term = $this->get_term_by_type( $type );
+
+		return '' !== get_term_meta( $no_type_needed_term->term_id, 'type_not_needed', true ) ? false : true;
+	}
+
+	/**
+	 * Set the no-page-needed term.
+	 *
+	 * @param string $type The type.
+	 *
+	 * @return void
+	 */
+	public function add_no_type_needed( $type ) {
+		$no_type_needed_term = $this->get_term_by_type( $type );
+		if ( ! $no_type_needed_term ) {
+			return;
+		}
+
+		\update_term_meta( $no_type_needed_term->term_id, 'type_not_needed', '1' );
+	}
+
+	/**
+	 * Remove the no-page-needed term.
+	 *
+	 * @param string $type The type.
+	 *
+	 * @return void
+	 */
+	public function remove_no_type_needed( $type ) {
+		$no_type_needed_term = $this->get_term_by_type( $type );
+		if ( ! $no_type_needed_term ) {
+			return;
+		}
+
+		\delete_term_meta( $no_type_needed_term->term_id, 'type_not_needed' );
+	}
+
+	/**
+	 * Get the term types that are not needed.
+	 *
+	 * @return \WP_Term[]
+	 */
+	public function get_not_needed_terms() {
+
+		$terms = \get_terms(
+			[
+				'taxonomy'   => self::TAXONOMY_NAME,
+				'hide_empty' => false,
+				'meta_key'   => 'type_not_needed',
+				'meta_value' => '1',
+			]
+		);
+
+		return $terms;
+	}
 }
diff --git a/phpstan.neon.dist b/phpstan.neon.dist
@@ -30,3 +30,4 @@ parameters:
     - '#Call to an undefined method Progress_Planner\\Base\:\:get_popovers__badges\(\).#'
     - '#Call to an undefined method Progress_Planner\\Base\:\:get_popovers__settings\(\).#'
     - '#Call to an undefined method Progress_Planner\\Base\:\:get_admin__dashboard_widget_score\(\).#'
+    - '#Call to an undefined method Progress_Planner\\Base\:\:get_admin__page_settings\(\).#'