From 48b7ecdf4f662bf32ca4ef0c60ef3e50aa8f36a9 Mon Sep 17 00:00:00 2001
From: Kelly Joseph Price <kellyjosephprice@gmail.com>
Date: Thu, 7 Sep 2023 13:37:48 -0700
Subject: [PATCH] fix: use slug instead of name (#815)

Switching reusable contents attr from `name` to `slug` to match the backend.
---
 Dockerfile                                             |  2 +-
 __tests__/flavored-compilers/reusable-content.test.js  |  4 ++--
 .../__snapshots__/reusable-content.test.js.snap        |  2 +-
 __tests__/transformers/reusable-content.test.js        |  8 ++++----
 processor/compile/reusable-content.js                  |  2 +-
 processor/transform/reusable-content.js                | 10 +++++-----
 6 files changed, 14 insertions(+), 14 deletions(-)

diff --git a/Dockerfile b/Dockerfile
index 8489f26c5..ae455b6f4 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -1,4 +1,4 @@
-ARG NODE_VERSION=14
+ARG NODE_VERSION=18
 FROM node:${NODE_VERSION}-buster
 
 ARG NODE_VERSION
diff --git a/__tests__/flavored-compilers/reusable-content.test.js b/__tests__/flavored-compilers/reusable-content.test.js
index ff2520ae7..37d710af0 100644
--- a/__tests__/flavored-compilers/reusable-content.test.js
+++ b/__tests__/flavored-compilers/reusable-content.test.js
@@ -2,7 +2,7 @@ import { mdast, md } from '../../index';
 
 describe('reusable content compiler', () => {
   it('writes an undefined reusable content block back to markdown', () => {
-    const doc = '<RMReusableContent name="undefined" />';
+    const doc = '<RMReusableContent slug="undefined" />';
     const tree = mdast(doc);
 
     expect(md(tree)).toMatch(doc);
@@ -12,7 +12,7 @@ describe('reusable content compiler', () => {
     const reusableContent = {
       defined: '# Whoa',
     };
-    const doc = '<RMReusableContent name="defined" />';
+    const doc = '<RMReusableContent slug="defined" />';
     const tree = mdast(doc, { reusableContent });
 
     expect(tree.children[0].children[0].type).toBe('heading');
diff --git a/__tests__/transformers/__snapshots__/reusable-content.test.js.snap b/__tests__/transformers/__snapshots__/reusable-content.test.js.snap
index c8ed59a0d..df8be52eb 100644
--- a/__tests__/transformers/__snapshots__/reusable-content.test.js.snap
+++ b/__tests__/transformers/__snapshots__/reusable-content.test.js.snap
@@ -36,7 +36,7 @@ Object {
       "type": "paragraph",
     },
   ],
-  "name": "test",
+  "slug": "test",
   "type": "reusable-content",
 }
 `;
diff --git a/__tests__/transformers/reusable-content.test.js b/__tests__/transformers/reusable-content.test.js
index 75d1c8116..59a6bfb5e 100644
--- a/__tests__/transformers/reusable-content.test.js
+++ b/__tests__/transformers/reusable-content.test.js
@@ -12,7 +12,7 @@ describe('reusable content transfomer', () => {
     const md = `
 Before
 
-<RMReusableContent name="test" />
+<RMReusableContent slug="test" />
 
 After
     `;
@@ -25,7 +25,7 @@ After
   });
 
   it('should insert an empty node if the reusable content block is not defined', () => {
-    const md = '<RMReusableContent name="not-defined" />';
+    const md = '<RMReusableContent slug="not-defined" />';
     const tree = mdast(md);
 
     expect(tree.children[0].type).toBe('reusable-content');
@@ -34,9 +34,9 @@ After
 
   it('does not expand reusable content recursively', () => {
     const reusableContent = {
-      test: '<RMReusableContent name="test" />',
+      test: '<RMReusableContent slug="test" />',
     };
-    const md = '<RMReusableContent name="test" />';
+    const md = '<RMReusableContent slug="test" />';
     const tree = mdast(md, { reusableContent });
 
     expect(tree.children[0].children[0].type).toBe('reusable-content');
diff --git a/processor/compile/reusable-content.js b/processor/compile/reusable-content.js
index df04b64f9..a46887316 100644
--- a/processor/compile/reusable-content.js
+++ b/processor/compile/reusable-content.js
@@ -4,5 +4,5 @@ export default function ReusableContentCompiler() {
   const { Compiler } = this;
   const { visitors } = Compiler.prototype;
 
-  visitors[type] = node => `<${tag} name="${node.name}" />`;
+  visitors[type] = node => `<${tag} slug="${node.slug}" />`;
 }
diff --git a/processor/transform/reusable-content.js b/processor/transform/reusable-content.js
index 671289d8f..4335661aa 100644
--- a/processor/transform/reusable-content.js
+++ b/processor/transform/reusable-content.js
@@ -3,7 +3,7 @@ import { visit } from 'unist-util-visit';
 export const type = 'reusable-content';
 export const tag = 'RMReusableContent';
 
-const regexp = new RegExp(`^\\s*<${tag} name="(?<name>.*)" />\\s*$`);
+const regexp = new RegExp(`^\\s*<${tag} slug="(?<slug>.*)" />\\s*$`);
 
 const reusableContentTransformer = function () {
   const reusableContent = this.data('reusableContent');
@@ -11,13 +11,13 @@ const reusableContentTransformer = function () {
   return tree => {
     visit(tree, 'html', (node, index, parent) => {
       const result = regexp.exec(node.value);
-      if (!result || !result.groups.name) return;
+      if (!result || !result.groups.slug) return;
 
-      const { name } = result.groups;
+      const { slug } = result.groups;
       const block = {
         type,
-        name,
-        children: name in reusableContent ? reusableContent[name] : [],
+        slug,
+        children: slug in reusableContent ? reusableContent[slug] : [],
       };
 
       parent.children[index] = block;