Skip to content

Commit

Permalink
MWPW-163728 Allow for multiple namespaces
Browse files Browse the repository at this point in the history
  • Loading branch information
Brandon32 committed Dec 6, 2024
1 parent 9d8d36f commit 106736c
Show file tree
Hide file tree
Showing 5 changed files with 91 additions and 32 deletions.
30 changes: 30 additions & 0 deletions test/tools/tags/tag-browser.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -88,4 +88,34 @@ describe('Locale Selector', () => {
expect(tagBrowser.actions.sendText.calledOnce).to.be.true;
expect(tagBrowser.actions.sendText.getCall(0).args[0]).to.equal('audience');
});

it('back button', async () => {
const tagBrowser = init();
await delay(100);

const groups = tagBrowser.shadowRoot.querySelector('.tag-groups');
const firstTitle = groups.firstElementChild.querySelector('.tag-title');
firstTitle.click();
await delay(100);

const backButton = tagBrowser.shadowRoot.querySelector('.tag-search button');
backButton.click();
await delay(100);

expect(groups.children).to.have.lengthOf(1);
});

it('search tags', async () => {
const tagBrowser = init();
await delay(100);

const searchBar = tagBrowser.shadowRoot.querySelector('.tag-search input');
searchBar.value = 'Authoring';
searchBar.dispatchEvent(new Event('input'));
await delay(100);

const groups = tagBrowser.shadowRoot.querySelector('.tag-groups');
expect(groups.children).to.have.lengthOf(1);
expect(groups.firstElementChild.querySelector('.tag-title').textContent.trim()).to.equal('Authoring');
});
});
8 changes: 4 additions & 4 deletions tools/sidekick/config.json
Original file line number Diff line number Diff line change
Expand Up @@ -79,7 +79,7 @@
"id": "localize-2",
"title": "Localize (V2)",
"environments": [ "edit" ],
"url": "https://main--bacom-blog--adobecom.hlx.live/tools/loc?milolibs=locui",
"url": "https://main--bacom-blog--adobecom.hlx.page/tools/loc?milolibs=locui",
"passReferrer": true,
"passConfig": true,
"includePaths": [ "**.xlsx**" ]
Expand All @@ -89,7 +89,7 @@
"id": "floodgate",
"title": "Floodgate",
"environments": [ "edit" ],
"url": "https://main--bacom-blog--adobecom.hlx.live/tools/floodgate?milolibs=floodgateui",
"url": "https://main--bacom-blog--adobecom.hlx.page/tools/floodgate?milolibs=floodgateui",
"passReferrer": true,
"passConfig": true,
"includePaths": [ "**.xlsx**" ]
Expand All @@ -108,14 +108,14 @@
"id": "bulk",
"title": "Bulk operations",
"environments": [ "edit", "dev", "preview", "live" ],
"url": "https://main--bacom-blog--adobecom.hlx.live/tools/bulk"
"url": "https://main--bacom-blog--adobecom.hlx.page/tools/bulk"
},
{
"id": "da-tags",
"title": "Tag Browser",
"environments": ["da-edit"],
"icon": "https://main--da-bacom-blog--adobecom.hlx.live/media/media_16dd3261cd73df7adf30ed02b31d7d58ada82a3f0.png",
"url": "https://dx-tags--da-bacom-blog--adobecom.hlx.live/tools/tags.html"
"url": "https://main--da-bacom-blog--adobecom.hlx.live/tools/tags.html"
}
]
}
9 changes: 2 additions & 7 deletions tools/tags/tag-browser.css
Original file line number Diff line number Diff line change
Expand Up @@ -10,13 +10,12 @@
height: 100vh;
}

.tag-browser .tag-search {
.tag-browser .search-details {
height: 36px;
display: flex;
align-items: center;
height: 36px;
justify-content: space-between;
line-height: 36px;
border-bottom: 1px solid #d1d1d1;
font-size: 16px;
padding: 0 12px;
}
Expand Down Expand Up @@ -67,7 +66,6 @@
line-height: 36px;
}

.tag-browser .tag-search .tag-title,
.tag-browser .tag-group .tag-title {
flex: 1;
padding: 0 6px;
Expand All @@ -79,9 +77,6 @@
background: none;
border: none;
text-align: left;
}

.tag-browser .tag-group .tag-title {
cursor: pointer;
}

Expand Down
20 changes: 11 additions & 9 deletions tools/tags/tag-browser.js
Original file line number Diff line number Diff line change
Expand Up @@ -72,7 +72,7 @@ class DaTagBrowser extends LitElement {

handleTagInsert(tag) {
this._activeTag = tag;
const tagValue = this._secondaryTags ? `,${this.getTagValue()}` : this.getTagValue();
const tagValue = this._secondaryTags ? `, ${this.getTagValue()}` : this.getTagValue();
this.actions.sendText(tagValue);
this._secondaryTags = true;
}
Expand All @@ -96,13 +96,15 @@ class DaTagBrowser extends LitElement {
renderSearchBar() {
return html`
<section class="tag-search">
<input
type="text"
placeholder="Search tags..."
@input=${this.handleSearchInput}
value=${this._searchQuery}
/>
${(this._tags.length > 1) ? html`<button @click=${this.handleBackClick}></button>` : nothing}
<div class="search-details">
<input
type="text"
placeholder="Search tags..."
@input=${this.handleSearchInput}
value=${this._searchQuery}
/>
${(this._tags.length > 1) ? html`<button @click=${this.handleBackClick}></button>` : nothing}
</div>
</section>
`;
}
Expand Down Expand Up @@ -139,7 +141,7 @@ class DaTagBrowser extends LitElement {
}

render() {
// if (this._tags.length === 0) return nothing;
if (this._tags.length === 0) return nothing;
return html`
<div class="tag-browser">
${this.renderSearchBar()}
Expand Down
56 changes: 44 additions & 12 deletions tools/tags/tags.js
Original file line number Diff line number Diff line change
Expand Up @@ -13,8 +13,8 @@ async function getAemRepo(project, opts) {
if (!resp.ok) return null;
const json = await resp.json();
const { value: repoId } = json.data.find((entry) => entry.key === 'aem.repositoryId') || {};
const { value: namespace } = json.data.find((entry) => entry.key === 'aem.tags.namespace') || {};
return { aemRepo: repoId, namespace };
const { value: namespaces } = json.data.find((entry) => entry.key === 'aem.tags.namespaces') || {};
return { aemRepo: repoId, namespaces };
}

async function getTags(path, opts) {
Expand All @@ -38,17 +38,48 @@ async function getTags(path, opts) {
return tags;
}

const getRootTags = async (namespaces, aemConfig, opts) => {
const createTagUrl = (namespace = '') => `https://${aemConfig.aemRepo}${ROOT_TAG_PATH}${namespace ? `/${namespace}` : ''}${TAG_EXT}`;

if (namespaces.length === 0) {
return getTags(createTagUrl(), opts).catch(() => null);
}

if (namespaces.length === 1) {
const namespace = namespaces[0].toLowerCase().replaceAll(' ', '-');
return getTags(createTagUrl(namespace), opts).catch(() => null);
}

return namespaces.map((title) => {
const namespace = title.toLowerCase().replaceAll(' ', '-');
return {
path: createTagUrl(namespace),
name: namespace,
title,
activeTag: '',
details: {},
};
});
};

function showError(message, link = null) {
const errorMessage = document.createElement(link ? 'a' : 'p');
const mainElement = document.body.querySelector('main');
const errorMessage = document.createElement('p');
errorMessage.textContent = message;

if (link) {
errorMessage.href = link;
errorMessage.target = '_blank';
const linkEl = document.createElement('a');
linkEl.textContent = 'View Here';
linkEl.href = link;
linkEl.target = '_blank';
errorMessage.append(linkEl);
}

const reloadButton = document.createElement('button');
reloadButton.textContent = 'Reload';
reloadButton.addEventListener('click', () => window.location.reload());
document.body.querySelector('main').append(errorMessage, reloadButton);

mainElement.append(errorMessage, reloadButton);
}

(async function init() {
Expand All @@ -59,23 +90,24 @@ function showError(message, link = null) {
}

const opts = { headers: { Authorization: `Bearer ${token}` } };
const aemConfig = await getAemRepo(context, opts).catch(() => {});
const aemConfig = await getAemRepo(context, opts).catch(() => null);
if (!aemConfig || !aemConfig.aemRepo) {
showError('Failed to retrieve AEM repository.');
showError('Failed to retrieve config. ', `https://da.live/config#/${context.org}/${context.repo}/`);
return;
}

const tagUrl = aemConfig.namespace ? `https://${aemConfig.aemRepo}${ROOT_TAG_PATH}/${aemConfig.namespace}${TAG_EXT}` : `https://${aemConfig.aemRepo}${ROOT_TAG_PATH}${TAG_EXT}`;
const rootTags = await getTags(tagUrl, opts).catch(() => null);
const namespaces = aemConfig?.namespaces.split(',').map((namespace) => namespace.trim()) || [];
const rootTags = await getRootTags(namespaces, aemConfig, opts);

if (!rootTags || rootTags.length === 0) {
showError('Could not load AEM tags.', `https://${aemConfig.aemRepo}${UI_TAG_PATH}`);
showError('Could not load tags. ', `https://${aemConfig.aemRepo}${UI_TAG_PATH}`);
return;
}

const daTagBrowser = document.createElement('da-tag-browser');
daTagBrowser.rootTags = rootTags;
daTagBrowser.getTags = async (tag) => getTags(tag.path, opts);
daTagBrowser.tagValue = aemConfig.namespace ? 'title' : 'path';
daTagBrowser.tagValue = aemConfig.namespaces ? 'title' : 'path';
daTagBrowser.actions = actions;
document.body.querySelector('main').append(daTagBrowser);
}());

0 comments on commit 106736c

Please sign in to comment.