From 849125d948fabd29e43fa9ec777dd1e58e993dfa Mon Sep 17 00:00:00 2001
From: James Tsay <tsay@adobe.com>
Date: Wed, 25 Sep 2024 14:51:33 -0700
Subject: [PATCH 1/2] Add analytics event

---
 acrobat/blocks/prompt-card/prompt-card.js | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/acrobat/blocks/prompt-card/prompt-card.js b/acrobat/blocks/prompt-card/prompt-card.js
index 4b5b45a1..c53d30a4 100644
--- a/acrobat/blocks/prompt-card/prompt-card.js
+++ b/acrobat/blocks/prompt-card/prompt-card.js
@@ -3,6 +3,7 @@ import { setLibs } from '../../scripts/utils.js';
 
 const miloLibs = setLibs('/libs');
 const { createTag } = await import(`${miloLibs}/utils/utils.js`);
+const { processTrackingLabels } = await import(`${miloLibs}/martech/attributes.js`);
 
 const classToastShow = 'prompt-toast--show';
 const getPlaceHolder = (x) => (window.mph?.[x] || x);
@@ -37,6 +38,7 @@ async function createBlock(element, cfg) {
     'data-toast': cfg.toast,
     'daa-im': true,
     'daa-lh': 'Featured prompts | Executive summary',
+    'daa-ll': `promptcard-${processTrackingLabels(cfg.title)}`,
   });
   const prefix = createTag('div', { class: 'prompt-prefix' });
   const icon = createTag('img', {

From 82efae2855a75055333a6ff09aac34f7256162eb Mon Sep 17 00:00:00 2001
From: James Tsay <tsay@adobe.com>
Date: Fri, 27 Sep 2024 16:08:02 -0700
Subject: [PATCH 2/2] Add prefix to analytics

---
 acrobat/blocks/prompt-card/prompt-card.js     |  3 +-
 .../mocks/body-template-group-more.html       | 55 +++++++++++++++++++
 .../prompt-card-template-group-more.test.js   | 27 +++++++++
 3 files changed, 84 insertions(+), 1 deletion(-)
 create mode 100644 test/blocks/prompt-card/mocks/body-template-group-more.html
 create mode 100644 test/blocks/prompt-card/prompt-card-template-group-more.test.js

diff --git a/acrobat/blocks/prompt-card/prompt-card.js b/acrobat/blocks/prompt-card/prompt-card.js
index 69fce998..12aa59e5 100644
--- a/acrobat/blocks/prompt-card/prompt-card.js
+++ b/acrobat/blocks/prompt-card/prompt-card.js
@@ -1,3 +1,4 @@
+/* eslint-disable prefer-template */
 /* eslint-disable compat/compat */
 import { setLibs } from '../../scripts/utils.js';
 
@@ -38,7 +39,7 @@ async function createBlock(element, cfg) {
     'data-toast': cfg.toast,
     'daa-im': true,
     'daa-lh': 'Featured prompts | Executive summary',
-    'daa-ll': `promptcard-${processTrackingLabels(cfg.title)}`,
+    'daa-ll': 'promptcard-' + processTrackingLabels(cfg.prefix) + '-' + processTrackingLabels(cfg.title),
   });
   const prefix = createTag('div', { class: 'prompt-prefix' });
   const icon = createTag('img', {
diff --git a/test/blocks/prompt-card/mocks/body-template-group-more.html b/test/blocks/prompt-card/mocks/body-template-group-more.html
new file mode 100644
index 00000000..b33359f9
--- /dev/null
+++ b/test/blocks/prompt-card/mocks/body-template-group-more.html
@@ -0,0 +1,55 @@
+<main>
+  <div>
+    <div class="prompt-card template group">
+      <div>
+        <div>Prefix</div>
+        <div>Ask</div>
+      </div>
+      <div>
+        <div>Rows</div>
+        <div>1</div>
+      </div>
+      <div>
+        <div></div>
+      </div>
+      <div>
+        <div>Title</div>
+        <div>Prompt</div>
+      </div>
+      <div>
+        <div>Sum it up</div>
+        <div>Summarize this document in 3 sentences.</div>
+      </div>
+      <div>
+        <div>Organize your thoughts</div>
+        <div>Suggest a few essay topics based on this reading that can help me get started.</div>
+      </div>
+      <div>
+        <div>Refresh your memory.</div>
+        <div>Provide 10 sample test questions that my professor could ask me.</div>
+      </div>
+      <div>
+        <div>Point out tech advantages</div>
+        <div>What are the key benefits for users of this proposed technology solution?</div>
+      </div>
+      <div>
+        <div>Point out tech advantages</div>
+        <div>What are the key benefits for users of this proposed technology solution?</div>
+      </div>
+      <div>
+        <div>Shorten up the intro</div>
+        <div>Rewrite the introduction so it has only 200 words and a Flesch reading score above 50.</div>
+      </div>
+    </div>
+    <div class="section-metadata">
+      <div>
+        <div>style</div>
+        <div>Four up, xl-spacing</div>
+      </div>
+      <div>
+        <div>background</div>
+        <div>#f8f8f8</div>
+      </div>
+    </div>
+  </div>
+</main>
\ No newline at end of file
diff --git a/test/blocks/prompt-card/prompt-card-template-group-more.test.js b/test/blocks/prompt-card/prompt-card-template-group-more.test.js
new file mode 100644
index 00000000..15358a88
--- /dev/null
+++ b/test/blocks/prompt-card/prompt-card-template-group-more.test.js
@@ -0,0 +1,27 @@
+/* eslint-disable no-promise-executor-return */
+/* eslint-disable compat/compat */
+import { readFile } from '@web/test-runner-commands';
+import { expect } from '@esm-bundle/chai';
+import { delay } from '../../helpers/waitfor.js';
+
+describe('prompt-cards using the template and group features', () => {
+  before(async () => {
+    document.head.innerHTML = await readFile({ path: './mocks/head.html' });
+    document.body.innerHTML = await readFile({ path: './mocks/body-template-group-more.html' });
+    await import('../../../acrobat/scripts/scripts.js');
+    await delay(500);
+    await new Promise((resolve) => requestAnimationFrame(resolve));
+  });
+
+  it('creates prompt cards', () => {
+    const blades = document.querySelectorAll('.prompt-card:not(.hidden)');
+    expect([...blades].length).to.equal(2);
+  });
+
+  it('shows all cards after click view-all button', async () => {
+    const button = document.querySelector('.view-all .con-button');
+    button.click();
+    const promptcards = document.querySelectorAll('.prompt-card:not(.hidden)');
+    expect([...promptcards].length).to.equal(6);
+  });
+});