Merge branch 'main' into feature/migrate-related-tags-x-module-to-com…

…position-api

.github/workflows/build.yml

@@ -8,11 +8,19 @@ jobs:
     runs-on: ubuntu-latest
 
     steps:
+      # Use GitHub App token as a workaround to allow bypassing branch-protection rules
+      # https://github.com/orgs/community/discussions/13836#discussioncomment-8535364
+      - uses: actions/create-github-app-token@v1
+        id: app-token
+        with:
+          app-id: ${{ vars.GH_TOKENS_APP_ID }}
+          private-key: ${{ secrets.GH_TOKENS_APP_PRIVATE_KEY }}
+
       - name: checkout repository
         uses: actions/checkout@v4
         with:
+          token: ${{ steps.app-token.outputs.token }}
           fetch-depth: 0
-          persist-credentials: false
 
       - name: Install
         uses: ./.github/actions/install
@@ -34,4 +42,4 @@ jobs:
         uses: ./.github/actions/release-alpha
         with:
           npm_token: ${{ secrets.NPM_TOKEN_GRANULAR_ACCESS }}
-          github_token: ${{ secrets.SUPPORT_TOKEN }}
+          github_token: ${{ steps.app-token.outputs.token }}

.github/workflows/edocs-dynamic-sync.yml

@@ -4,9 +4,18 @@ jobs:
   connect-with-edocs:
     runs-on: ubuntu-latest
     steps:
+      # Use GitHub App token as a workaround to allow bypassing branch-protection rules
+      # https://github.com/orgs/community/discussions/13836#discussioncomment-8535364
+      - uses: actions/create-github-app-token@v1
+        id: app-token
+        with:
+          app-id: ${{ vars.GH_TOKENS_APP_ID }}
+          private-key: ${{ secrets.GH_TOKENS_APP_PRIVATE_KEY }}
+
       - name: Checkout X mono-repo
         uses: actions/checkout@v4
         with:
+          token: ${{ steps.app-token.outputs.token }}
           fetch-depth: 0
       - name: Get X Components Version
         id: package-version
@@ -23,5 +32,5 @@ jobs:
           --url https://api.github.com/repos/empathyco/docs-framework/actions/workflows/93444504/dispatches \
           --data '{"ref": "main",  "inputs": {"branchName": "${{ env.BRANCH_NAME }}", "version": "${{ steps.package-version.outputs.current-version }}"}}'
         env:
-          GITHUB_TOKEN: ${{ secrets.SUPPORT_TOKEN }}
+          GITHUB_TOKEN: ${{ steps.app-token.outputs.token }}
 

.github/workflows/publish-release.yml

@@ -9,10 +9,18 @@ jobs:
       options: --user 1001
 
     steps:
+      # Use GitHub App token as a workaround to allow bypassing branch-protection rules
+      # https://github.com/orgs/community/discussions/13836#discussioncomment-8535364
+      - uses: actions/create-github-app-token@v1
+        id: app-token
+        with:
+          app-id: ${{ vars.GH_TOKENS_APP_ID }}
+          private-key: ${{ secrets.GH_TOKENS_APP_PRIVATE_KEY }}
+
       - uses: actions/checkout@v4
         with:
+          token: ${{ steps.app-token.outputs.token }}
           fetch-depth: 0
-          persist-credentials: false
 
       # Install pnpm because it is not included in our container image
       - name: install pnpm
@@ -51,6 +59,6 @@ jobs:
       - name: push tags
         uses: ad-m/github-push-action@master
         with:
-          github_token: ${{ secrets.SUPPORT_TOKEN }}
+          github_token: ${{ steps.app-token.outputs.token }}
           branch: ${{ github.ref }}
           tags: true

.github/workflows/release-alpha.yml

@@ -9,11 +9,19 @@ jobs:
       options: --user 1001
 
     steps:
+      # Use GitHub App token as a workaround to allow bypassing branch-protection rules
+      # https://github.com/orgs/community/discussions/13836#discussioncomment-8535364
+      - uses: actions/create-github-app-token@v1
+        id: app-token
+        with:
+          app-id: ${{ vars.GH_TOKENS_APP_ID }}
+          private-key: ${{ secrets.GH_TOKENS_APP_PRIVATE_KEY }}
+
       - name: checkout repository
         uses: actions/checkout@v4
         with:
+          token: ${{ steps.app-token.outputs.token }}
           fetch-depth: 0
-          persist-credentials: false
 
       # Install pnpm because it is not included in our container image
       - name: install pnpm
@@ -28,4 +36,4 @@ jobs:
         uses: ./.github/actions/release-alpha
         with:
           npm_token: ${{ secrets.NPM_TOKEN_GRANULAR_ACCESS }}
-          github_token: ${{ secrets.SUPPORT_TOKEN }}
+          github_token: ${{ steps.app-token.outputs.token }}

packages/_vue3-migration-test/CHANGELOG.md

@@ -3,6 +3,33 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.0.0-alpha.24](https://github.com/empathyco/x/compare/[email protected]@1.0.0-alpha.24) (2024-06-05)
+
+
+### Features
+
+* migrate PartialQueryButton and PartialResultsList (#1501) ([5e87123](https://github.com/empathyco/x/commit/5e87123d4a6c1edeb05f83c31ee8f096b5558e0f))
+
+
+
+## [1.0.0-alpha.23](https://github.com/empathyco/x/compare/[email protected]@1.0.0-alpha.23) (2024-06-04)
+
+
+### Features
+
+* add BaseEventsModal to the playground ([3e437c5](https://github.com/empathyco/x/commit/3e437c56d4e3f314b373b486e8926c4f4b028fc6))
+
+
+
+## [1.0.0-alpha.22](https://github.com/empathyco/x/compare/[email protected]@1.0.0-alpha.22) (2024-06-04)
+
+
+### Features
+
+* **base-id-modal:** migrate to composition API (#1500) ([6274c67](https://github.com/empathyco/x/commit/6274c676946536c9c1c4e54205ebda18c79b8f55))
+
+
+
 ## [1.0.0-alpha.21](https://github.com/empathyco/x/compare/[email protected]@1.0.0-alpha.21) (2024-05-31)
 
 

packages/_vue3-migration-test/package.json

@@ -1,7 +1,7 @@
 {
   "name": "vue3-migration-test",
   "private": "true",
-  "version": "1.0.0-alpha.21",
+  "version": "1.0.0-alpha.24",
   "scripts": {
     "dev": "vite",
     "preview": "vite preview",

packages/_vue3-migration-test/src/components/index.ts

@@ -12,3 +12,5 @@ export { default as TestHighlight } from './test-highlight.vue';
 export { default as TestBaseResultImages } from './result/test-base-result-images.vue';
 export { default as TestBasePanel } from './panels/test-base-panel.vue';
 export { default as TestBaseKeyboardNavigation } from './test-base-keyboard-navigation.vue';
+export { default as TestBaseEventsModal } from './modals/test-base-events-modal.vue';
+export { default as TestBaseIdModal } from './modals/test-base-id-modal.vue';

packages/_vue3-migration-test/src/components/modals/test-base-events-modal.vue

@@ -0,0 +1,43 @@
+<template>
+  <div class="base-modal">
+    <button @click="openModal">Open modal</button>
+    <BaseEventsModal
+      :animation="Fade"
+      :focusOnOpen="true"
+      v-bind="$attrs"
+      contentClass="content"
+      overlayClass="overlay"
+    >
+      <h1>Hello</h1>
+      <p>The modal is working with events!!</p>
+      <button @click="closeModal">Close modal</button>
+    </BaseEventsModal>
+  </div>
+</template>
+
+<script setup lang="ts">
+  import BaseEventsModal from '../../../../x-components/src/components/modals/base-events-modal.vue';
+  import Fade from '../../../../x-components/src/components/animations/fade.vue';
+  import { use$x } from '../../../../x-components/src/composables/use-$x';
+  const _$x = use$x();
+
+  const openModal = () => _$x.emit('UserClickedOpenEventsModal');
+
+  const closeModal = () => _$x.emit('UserClickedCloseEventsModal');
+</script>
+
+<style>
+  .base-modal {
+    .content {
+      background: white;
+      margin: auto;
+      width: 50%;
+      border: 3px solid green;
+      padding: 10px;
+    }
+
+    .overlay {
+      background-color: #00ff80;
+    }
+  }
+</style>

packages/_vue3-migration-test/src/components/modals/test-base-id-modal.vue

@@ -0,0 +1,33 @@
+<template>
+  <div class="base-id-modal">
+    <BaseIdModalOpen modalId="myModal">Open</BaseIdModalOpen>
+    <BaseIdModal :animation="Fade" modalId="myModal" contentClass="content" overlayClass="overlay">
+      <h1>Hello</h1>
+      <p>The base id modal is working</p>
+      <BaseIdModalClose modalId="myModal">Close</BaseIdModalClose>
+    </BaseIdModal>
+  </div>
+</template>
+
+<script setup lang="ts">
+  import BaseIdModal from '../../../../x-components/src/components/modals/base-id-modal.vue';
+  import BaseIdModalOpen from '../../../../x-components/src/components/modals/base-id-modal-open.vue';
+  import BaseIdModalClose from '../../../../x-components/src/components/modals/base-id-modal-close.vue';
+  import Fade from '../../../../x-components/src/components/animations/fade.vue';
+</script>
+
+<style>
+  .base-id-modal {
+    .content {
+      background: white;
+      margin: auto;
+      width: 50%;
+      border: 3px solid green;
+      padding: 10px;
+    }
+
+    .overlay {
+      background-color: red;
+    }
+  }
+</style>

packages/_vue3-migration-test/src/router.ts

@@ -24,10 +24,15 @@ import {
   TestSlidingPanel,
   TestBaseSuggestions,
   TestHighlight,
+  TestHistoryQueries,
+  TestMyHistory,
   TestBaseResultImages,
   TestBasePanel,
   TestBaseKeyboardNavigation,
-  TestRelatedTags
+  TestRelatedTags,
+  TestPartialResultsList,
+  TestBaseEventsModal,
+  TestBaseIdModal
 } from './';
 
 const routes = [
@@ -151,6 +156,16 @@ const routes = [
     name: 'Highlight',
     component: TestHighlight
   },
+  {
+    path: '/history-queries',
+    name: 'HistoryQueries',
+    component: TestHistoryQueries
+  },
+  {
+    path: '/my-history',
+    name: 'MyHistory',
+    component: TestMyHistory
+  },
   {
     path: '/base-result-images',
     name: 'BaseResultImages',
@@ -170,6 +185,21 @@ const routes = [
     path: '/related-tags',
     name: 'RelatedTags',
     component: TestRelatedTags
+  },
+  {
+    path: '/partial-results-list',
+    name: 'PartialResultsList',
+    component: TestPartialResultsList
+  },
+  {
+    path: '/base-events-modal',
+    name: 'BaseEventsModal',
+    component: TestBaseEventsModal
+  },
+  {
+    path: '/test-base-id-modal',
+    name: 'TestBaseIdModal',
+    component: TestBaseIdModal
   }
 ];
 

packages/_vue3-migration-test/src/x-modules/history-queries/components/index.ts

@@ -0,0 +1,2 @@
+export { default as TestHistoryQueries } from './test-history-queries.vue';
+export { default as TestMyHistory } from './test-my-history.vue';

packages/_vue3-migration-test/src/x-modules/history-queries/components/test-history-queries.vue

@@ -0,0 +1,16 @@
+<template>
+  <SearchInput :maxLength="10" />
+  <ClearSearchInput />
+
+  <HistoryQueries :maxItemsToRender="5" />
+  <ClearHistoryQueries class="x-button--ghost x-button--ghost-start">
+    <span>Clear previous searches</span>
+  </ClearHistoryQueries>
+</template>
+
+<script setup>
+  import HistoryQueries from '../../../../../x-components/src/x-modules/history-queries/components/history-queries.vue';
+  import ClearHistoryQueries from '../../../../../x-components/src/x-modules/history-queries/components/clear-history-queries.vue';
+  import ClearSearchInput from '../../../../../x-components/src/x-modules/search-box/components/clear-search-input.vue';
+  import SearchInput from '../../../../../x-components/src/x-modules/search-box/components/search-input.vue';
+</script>

packages/_vue3-migration-test/src/x-modules/history-queries/components/test-my-history.vue

@@ -0,0 +1,33 @@
+<template>
+  <MyHistory v-if="_$x.isHistoryQueriesEnabled && _$x.fullHistoryQueries.length">
+    <template #date="{ date }">
+      <div>{{ date }}</div>
+    </template>
+
+    <template #suggestion="{ suggestion, formatTime }">
+      <HistoryQuery data-test="my-history-query" :suggestion="suggestion">
+        <div class="flex flex-row gap-8">
+          <p>{{ suggestion.query }}</p>
+
+          <p>
+            {{ formatTime(suggestion.timestamp) }}
+          </p>
+        </div>
+
+        <template #remove-button-content>
+          <span>x</span>
+        </template>
+      </HistoryQuery>
+    </template>
+  </MyHistory>
+</template>
+
+<script setup>
+  import HistoryQuery from '../../../../../x-components/src/x-modules/history-queries/components/history-query.vue';
+  import MyHistory from '../../../../../x-components/src/x-modules/history-queries/components/my-history.vue';
+  import { use$x } from '../../../../../x-components/src/composables/use-$x';
+
+  const _$x = use$x();
+</script>
+
+<style scoped></style>

packages/_vue3-migration-test/src/x-modules/history-queries/index.ts

@@ -0,0 +1 @@
+export * from './components';

packages/_vue3-migration-test/src/x-modules/index.ts

@@ -6,3 +6,4 @@ export * from './search-box';
 export { default as TestElementsList } from './test-elements-list.vue';
 export * from './scroll';
 export * from './related-tags';
+export * from './history-queries';

packages/_vue3-migration-test/src/x-modules/search/components/index.ts

@@ -1,3 +1,4 @@
 export { default as TestSortDropdown } from './test-sort-dropdown.vue';
 export { default as TestSortList } from './test-sort-list.vue';
 export { default as TestSortPickerList } from './test-sort-picker-list.vue';
+export { default as TestPartialResultsList } from './test-partial-results-list.vue';