FEATURE introducing block

plugins/carhop-blocks/src/see-also/block.json

@@ -0,0 +1,20 @@
+{
+	"$schema": "https://schemas.wp.org/trunk/block.json",
+	"apiVersion": 3,
+	"name": "carhop-blocks/see-also",
+	"version": "0.1.0",
+	"title": "Voir aussi",
+	"category": "carhop-blocks",
+	"icon": "smiley",
+	"description": "Voir aussi",
+	"example": {},
+	"supports": {
+		"html": false
+	},
+	"textdomain": "carhop-blocks",
+	"editorScript": "file:./index.js",
+	"editorStyle": "file:./index.css",
+	"style": "file:./style-index.css",
+	"viewScript": "file:./view.js",
+	"render": "file:./render.php"
+}

plugins/carhop-blocks/src/see-also/edit.js

@@ -0,0 +1,16 @@
+import { __ } from "@wordpress/i18n";
+import { useBlockProps } from "@wordpress/block-editor";
+import ServerSideRender from "@wordpress/server-side-render";
+
+import "./editor.scss";
+
+export default function Edit(props) {
+	return (
+		<div {...useBlockProps({ className: "alignfull" })}>
+			<ServerSideRender
+				block="carhop-blocks/see-also"
+				attributes={props.attributes}
+			/>
+		</div>
+	);
+}

plugins/carhop-blocks/src/see-also/index.js

@@ -0,0 +1,21 @@
+import { registerBlockType } from "@wordpress/blocks";
+
+import "./style.scss";
+
+import Edit from "./edit";
+import save from "./save";
+import metadata from "./block.json";
+
+registerBlockType(metadata.name, {
+	icon: {
+		src: (
+			<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28 32">
+				<path d="M0,27v-3.87l3.98-3.97V5.61L9.61,0h8.77l5.63,5.61v13.54l3.98,3.97v3.87" />
+				<path class="cls-1" d="M9,31h10" />
+			</svg>
+		),
+		foreground: "#136f63",
+	},
+	edit: Edit,
+	save,
+});

plugins/carhop-blocks/src/see-also/render.php

@@ -0,0 +1,36 @@
+<?php
+$wrapper_attributes = get_block_wrapper_attributes(['class' => 'see-also alignfull']);
+$title = $attributes['title'] ?? null;
+
+$current_post_ID = $attributes['currentPostID'] ?? get_the_ID();
+$current_tags = get_the_terms($current_post_ID, 'etiquettes');
+
+
+$relate_topic_posts = get_posts(array(
+	'post_type' => array('analyses-etudes', 'expositions', 'outils-pedagogiques'),
+	'tax_query' => array(
+		array(
+			'taxonomy' => 'etiquettes',
+			'field' => 'term_id',
+			'terms' => wp_list_pluck($current_tags, 'term_id'),
+		),
+	),
+	'posts_per_page' => 3,
+	'post__not_in' => array($current_post_ID),
+));
+
+?>
+
+<section <?php echo $wrapper_attributes; ?>>
+	<div class="inner">
+		<div class="see-also__titling">
+			<h2 class="see-also__title title-small">Suggestions</h2>
+			<h3 class="see-also__subtitle subtitle-big">Voir aussi <br /> sur ce sujet</h3>
+		</div>
+		<div class="post-list">
+			<?php foreach ($relate_topic_posts as $post) : ?>
+				<?php get_template_part('template-parts/components/cards/post-card', null, array('ID' => $post->ID, 'current_post_type' => $post->post_type)); ?>
+			<?php endforeach; ?>
+		</div>
+	</div>
+</section>

plugins/carhop-blocks/src/see-also/save.js

@@ -0,0 +1,3 @@
+export default function save() {
+	return <></>;
+}