@eventcatalog/core 2.0.6 → 2.0.8

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @eventcatalog/core
 
+## 2.0.8
+
+### Patch Changes
+
+- 5bde1d4: feat(core): versions now show as a dropdown
+
+## 2.0.7
+
+### Patch Changes
+
+- b82d79e: feat(core): Renders names for services side bars and also links to services from domains fixed
+
 ## 2.0.6
 
 ### Patch Changes

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@eventcatalog/core",
   "type": "module",
-  "version": "2.0.6",
+  "version": "2.0.8",
   "publishConfig": {
     "access": "public"
   },

package/src/components/Lists/VersionList.astro

@@ -9,21 +9,27 @@ interface Props {
 
 const { versions, collectionItem } = Astro.props;
 const currentPath = Astro.url.pathname;
+
 ---
 
 <div class="space-y-2 my-2 mb-8">
   <span class="font-light text-black group-data-[hover]:text-black/80 capitalize">Versions ({collectionItem.data.versions?.length})</span>
-  <ul class="space-x-2 flex">
-  {versions.map((version) => {
-    const isCurrent = currentPath.includes(version);
-    return <li>
-      <a href={`/docs/${collectionItem.collection}/${collectionItem.data.id}/${version}`} class={`inline-flex items-center rounded-md  px-2 py-1 text-xs font-medium text-indigo-700 ring-1 ring-inset ring-indigo-700/10 hover:bg-purple-100 hover:underline ${isCurrent ? 'bg-purple-100 text-purple-500 underline ' : 'bg-white'}`}>
+  <select id="version" class="block bg-gray-50 rounded-md border border-gray-200 px-1 py-0.5 text-xs"> 
+    {versions.map((version) => {
+      const isCurrent = currentPath.includes(version);
+      return <option selected={isCurrent} value={`/docs/${collectionItem.collection}/${collectionItem.data.id}/${version}`} class={`inline-flex items-center rounded-md  px-2 py-1 text-xs text-indigo-700 ring-1 ring-inset ring-indigo-700/10 hover:bg-purple-100 hover:underline ${isCurrent ? 'bg-purple-100 text-purple-500 underline ' : 'bg-white'}`}>
         <span>
           v{version} 
           {version === collectionItem.data.latestVersion && <span>(latest)</span>}
         </span>
-      </a>
-    </li>
-  })}
-  </ul>
-</div>
+      </option>
+    })}
+  </select>
+</div>
+
+<script>
+  document.getElementById('version')?.addEventListener('change', (e: any) => {
+    if (!e.target) return
+    window.location.href = e.target.value;
+  })
+</script>

package/src/components/SideBars/DomainSideBar.astro

@@ -19,7 +19,7 @@ const serviceList = services.map((p) => ({
   label: p.data.id,
   badge: p.collection,
   tag: `v${p.data.version}`,
-  href: `/docs/${p.collection}/${p.data.id}`,
+  href: `/docs/${p.collection}/${p.data.id}/${p.data.version}`,
 }));
 
 const ownersList = owners.map((o) => ({

package/src/components/SideBars/ServiceSideBar.astro

@@ -19,14 +19,14 @@ const ownersRaw = service.data?.owners || [];
 const owners = await Promise.all(ownersRaw.map((o) => getEntry(o)));
 
 const sendsList = sends.map((p) => ({
-  label: p.data.id,
+  label: p.data.name,
   badge: p.collection,
   color: p.collection === 'events' ? 'orange' : 'blue',
   tag: `v${p.data.version}`,
   href: `/docs/${p.collection}/${p.data.id}/${p.data.version}`,
 }));
 const receivesList = receives.map((p) => ({
-  label: p.data.id,
+  label: p.data.name,
   badge: p.collection,
   color: p.collection === 'events' ? 'orange' : 'blue',
   tag: `v${p.data.version}`,