Merge branch '1.x'

washingtonstateuniversity · Oct 30, 2023 · 8c71d40 · 8c71d40
2 parents f3c4512 + 8dae603
commit 8c71d40
Show file tree

Hide file tree

Showing 8 changed files with 81 additions and 79 deletions.
diff --git a/assets/dist/index.asset.php b/assets/dist/index.asset.php
@@ -1 +1 @@
-<?php return array('dependencies' => array('wp-blocks', 'wp-element'), 'version' => 'e26b63723c3f032aecbe');
+<?php return array('dependencies' => array('wp-blocks', 'wp-element'), 'version' => '552456ab5d783a21e14a');
diff --git a/assets/dist/index.css b/assets/dist/index.css
diff --git a/assets/dist/index.js b/assets/dist/index.js
diff --git a/assets/src/hooks.js b/assets/src/hooks.js
@@ -25,7 +25,7 @@ const useFetch = function (url, options = {}) {
 
     (async () => {
       try {
-        console.log("Calling: " + url);
+        // console.log("Calling: " + url);
         const response = await fetch(url, options);
         const responseJson = await response.json();
 

diff --git a/assets/src/html-snippet/editor/_styles.scss b/assets/src/html-snippet/editor/_styles.scss
@@ -63,6 +63,7 @@ $component-class-name: ".wp-block-wsuwp-html-snippet";
       position: relative;
       opacity: 1;
       height: 500px;
+      width: 100%;
     }
   }
 }
diff --git a/assets/src/html-snippet/editor/edit.js b/assets/src/html-snippet/editor/edit.js
@@ -2,11 +2,16 @@ import { useFetch } from "../../hooks";
 
 const { useState, useRef, useEffect } = wp.element;
 const { SelectControl, Button, Spinner } = wp.components;
+const { InnerBlocks, useBlockProps, InspectorControls } = wp.blockEditor;
 
 const Edit = (props) => {
   const { className, attributes, setAttributes } = props;
   const [previewLoaded, setPreviewLoaded] = useState(false);
   const previewRef = useRef(null);
+  const blockClass = "wp-block-wsuwp-html-snippet";
+  const blockProps = useBlockProps({
+    className: blockClass,
+  });
 
   const apiPath = "/wp-json/wp/v2/wsu_html_snippet";
   const { data, isLoading } = useFetch(`${WSUWP_DATA.siteUrl}${apiPath}`);
@@ -69,86 +74,82 @@ const Edit = (props) => {
   const editLink = getEditLink(selectedOption);
 
   return (
-    <>
-      <div className={className}>
-        <div className={`${className}__header`}>
-          <div className={`${className}__label`}>
-            <span
-              className={`dashicon dashicons dashicons-embed-generic`}
-            ></span>
-            HTML Snippet
-          </div>
-          <div className={`${className}__controls`}>
-            {editLink && (
-              <Button
-                className={`${className}__control is-tertiary`}
-                icon="edit"
-                href={editLink}
-                target="_blank"
-              >
-                Edit Snippet
-              </Button>
-            )}
+    <div {...blockProps}>
+      <div className={`${blockClass}__header`}>
+        <div className={`${blockClass}__label`}>
+          <span className={`dashicon dashicons dashicons-embed-generic`}></span>
+          HTML Snippet
+        </div>
+        <div className={`${blockClass}__controls`}>
+          {editLink && (
             <Button
-              className={`${className}__control is-tertiary`}
-              icon={attributes.show_preview ? "hidden" : "visibility"}
-              onClick={() => {
-                reset();
-                setAttributes({ show_preview: !attributes.show_preview });
-              }}
+              className={`${blockClass}__control is-tertiary`}
+              icon="edit"
+              href={editLink}
+              target="_blank"
             >
-              {attributes.show_preview ? "Hide" : "Show"} Preview
+              Edit Snippet
             </Button>
-          </div>
-        </div>
-        <div className="">
-          <SelectControl
-            className={`${className}__select-control`}
-            value={attributes.snippet_id}
-            options={options}
-            onChange={(id) => {
+          )}
+          <Button
+            className={`${blockClass}__control is-tertiary`}
+            icon={attributes.show_preview ? "hidden" : "visibility"}
+            onClick={() => {
               reset();
-              setAttributes({ snippet_id: id });
+              setAttributes({ show_preview: !attributes.show_preview });
             }}
-          />
+          >
+            {attributes.show_preview ? "Hide" : "Show"} Preview
+          </Button>
         </div>
-
-        {selectedOption && attributes.show_preview && !previewLoaded ? (
-          <Spinner className={`${className}__spinner`} />
-        ) : (
-          ""
-        )}
-
-        {selectedOption && attributes.show_preview ? (
-          // <div
-          //   className={`${className}__preview`}
-          //   dangerouslySetInnerHTML={{
-          //     __html: selectedOption.content.rendered,
-          //   }}
-          // ></div>
-
-          <iframe
-            ref={previewRef}
-            className={`${className}__preview ${previewLoaded ? "loaded" : ""}`}
-            src={`${selectedOption.link}&preview=true`}
-            onLoad={(e) => {
-              // const el = e.target;
-              // console.log(e.target);
-              setPreviewLoaded(true);
-
-              // setTimeout(() => {
-              //   el.style.height =
-              //     el.contentWindow.document.body.querySelector(
-              //       "#wsu-gutenberg-snippet-preview"
-              //     ).offsetHeight + "px";
-              // }, 200);
-            }}
-          ></iframe>
-        ) : (
-          ""
-        )}
       </div>
-    </>
+      <div className="">
+        <SelectControl
+          className={`${blockClass}__select-control`}
+          value={attributes.snippet_id}
+          options={options}
+          onChange={(id) => {
+            reset();
+            setAttributes({ snippet_id: id });
+          }}
+        />
+      </div>
+
+      {selectedOption && attributes.show_preview && !previewLoaded ? (
+        <Spinner className={`${blockClass}__spinner`} />
+      ) : (
+        ""
+      )}
+
+      {selectedOption && attributes.show_preview ? (
+        // <div
+        //   className={`${blockClass}__preview`}
+        //   dangerouslySetInnerHTML={{
+        //     __html: selectedOption.content.rendered,
+        //   }}
+        // ></div>
+
+        <iframe
+          ref={previewRef}
+          className={`${blockClass}__preview ${previewLoaded ? "loaded" : ""}`}
+          src={`${selectedOption.link}&preview=true`}
+          onLoad={(e) => {
+            // const el = e.target;
+            // console.log(e.target);
+            setPreviewLoaded(true);
+
+            // setTimeout(() => {
+            //   el.style.height =
+            //     el.contentWindow.document.body.querySelector(
+            //       "#wsu-gutenberg-snippet-preview"
+            //     ).offsetHeight + "px";
+            // }, 200);
+          }}
+        ></iframe>
+      ) : (
+        ""
+      )}
+    </div>
   );
 };
 

diff --git a/includes/html-snippet-block.php b/includes/html-snippet-block.php
@@ -13,7 +13,7 @@ class Block_WSUWP_HTML_Snippet
     public static function render( $attrs, $content = '' )
     {
 
-        if ('' === $attrs['snippet_id']) {
+        if ('' === ($attrs['snippet_id'] ?? '')) {
             return;
         }
 

diff --git a/wsuwp-html-snippets.php b/wsuwp-html-snippets.php
@@ -1,7 +1,7 @@
 <?php
 /*
 Plugin Name: WSU HTML Snippets
-Version: 1.2.3
+Version: 1.2.4
 Description: Embed common HTML content throughout a WordPress site.
 Author: washingtonstateuniversity, jeremyfelt
 Author URI: https://web.wsu.edu/
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		<?php return array('dependencies' => array('wp-blocks', 'wp-element'), 'version' => 'e26b63723c3f032aecbe');
		<?php return array('dependencies' => array('wp-blocks', 'wp-element'), 'version' => '552456ab5d783a21e14a');
-Original file line number
+Diff line change
@@ Expand Up / @@ -13,7 +13,7 @@ class Block_WSUWP_HTML_Snippet @@
         public static function render( $attrs, $content = '' )
         {
-            if ('' === $attrs['snippet_id']) {
+            if ('' === ($attrs['snippet_id'] ?? '')) {
                 return;
             }
@@ Expand Down @@