From 5bcc6595f8c2182e5cb553b47bb71497c30851dd Mon Sep 17 00:00:00 2001 From: amansinghbais Date: Tue, 18 Jun 2024 12:32:26 +0530 Subject: [PATCH 1/4] Implemented: modal for gitbook Search functionality (#301) --- src/components/DxpGitBookSearch.vue | 17 +++++++++++++++++ src/index.ts | 3 ++- src/utils/index.ts | 17 +++++++++++++++-- 3 files changed, 34 insertions(+), 3 deletions(-) create mode 100644 src/components/DxpGitBookSearch.vue diff --git a/src/components/DxpGitBookSearch.vue b/src/components/DxpGitBookSearch.vue new file mode 100644 index 0000000..efbdea6 --- /dev/null +++ b/src/components/DxpGitBookSearch.vue @@ -0,0 +1,17 @@ + + + \ No newline at end of file diff --git a/src/index.ts b/src/index.ts index fb9927f..9652c92 100644 --- a/src/index.ts +++ b/src/index.ts @@ -4,7 +4,7 @@ import { createPinia } from "pinia"; import { useProductIdentificationStore } from "./store/productIdentification"; import { useAuthStore } from "./store/auth"; import { DxpAppVersionInfo, DxpImage, DxpLanguageSwitcher, DxpLogin, DxpMenuFooterNavigation, DxpOmsInstanceNavigator, DxpProductIdentifier, DxpShopifyImg, DxpTimeZoneSwitcher, DxpUserProfile } from "./components"; -import { goToOms, getProductIdentificationValue } from "./utils"; +import { goToOms, getProductIdentificationValue, openGitBookSearchModal } from "./utils"; import { initialiseFirebaseApp } from "./utils/firebase" import piniaPluginPersistedstate from 'pinia-plugin-persistedstate' import { createI18n } from 'vue-i18n' @@ -127,6 +127,7 @@ export { initialiseFirebaseApp, loginContext, notificationContext, + openGitBookSearchModal, productIdentificationContext, shopifyImgContext, translate, diff --git a/src/utils/index.ts b/src/utils/index.ts index 9532d21..bd2101a 100644 --- a/src/utils/index.ts +++ b/src/utils/index.ts @@ -1,6 +1,7 @@ -import { toastController } from "@ionic/vue"; +import { modalController, toastController } from "@ionic/vue"; import { DateTime } from "luxon"; import { translate } from "src"; +import DxpGitBookSearch from "../components/DxpGitBookSearch.vue"; import { computed, ref } from "vue"; const goToOms = (token: string, oms: string) => { @@ -52,9 +53,21 @@ const getCurrentTime = (zone: string, format = 't ZZZZ') => { return DateTime.now().setZone(zone).toFormat(format) } +const openGitBookSearchModal = async () => { + const modal = await modalController.create({ + component: DxpGitBookSearch + }) + + console.log(modal); + + + return modal.present(); +} + export { getCurrentTime, getProductIdentificationValue, goToOms, - showToast + showToast, + openGitBookSearchModal } \ No newline at end of file From e2e2f7d1c05f36a151d9d170a2b44f641aeddc85 Mon Sep 17 00:00:00 2001 From: amansinghbais Date: Tue, 18 Jun 2024 15:13:04 +0530 Subject: [PATCH 2/4] Improved: gitbook search modal and install module for parsing markdown (#301) --- package-lock.json | 107 +++++++++++- package.json | 3 +- src/components/DxpGitBookSearch.vue | 244 ++++++++++++++++++++++++++-- src/components/index.ts | 1 + src/index.ts | 6 +- src/utils/index.ts | 14 +- 6 files changed, 341 insertions(+), 34 deletions(-) diff --git a/package-lock.json b/package-lock.json index daed38f..76abfe1 100644 --- a/package-lock.json +++ b/package-lock.json @@ -18,7 +18,8 @@ "pinia-plugin-persistedstate": "^3.1.0", "register-service-worker": "^1.7.2", "vue": "^3.3.4", - "vue-i18n": "^9.2.2" + "vue-i18n": "^9.2.2", + "vue-markdown-render": "^2.2.1" }, "devDependencies": { "@babel/types": "^7.22.11", @@ -1900,8 +1901,7 @@ "node_modules/argparse": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz", - "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==", - "dev": true + "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==" }, "node_modules/array-union": { "version": "2.1.0", @@ -2212,6 +2212,17 @@ "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz", "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==" }, + "node_modules/entities": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/entities/-/entities-3.0.1.tgz", + "integrity": "sha512-WiyBqoomrwMdFG1e0kqvASYfnlb0lp8M5o5Fw2OFq1hNZxxcNk8Ik0Xm7LxzBhuidnZB/UtBqVCgUz3kBOP51Q==", + "engines": { + "node": ">=0.12" + }, + "funding": { + "url": "https://github.com/fb55/entities?sponsor=1" + } + }, "node_modules/esbuild": { "version": "0.18.20", "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.18.20.tgz", @@ -3392,6 +3403,14 @@ "node": ">= 0.8.0" } }, + "node_modules/linkify-it": { + "version": "4.0.1", + "resolved": "https://registry.npmjs.org/linkify-it/-/linkify-it-4.0.1.tgz", + "integrity": "sha512-C7bfi1UZmoj8+PQx22XyeXCuBlokoyWQL5pWSP+EI6nzRylyThouddufc2c1NDIcP9k5agmN9fLpA7VNJfIiqw==", + "dependencies": { + "uc.micro": "^1.0.1" + } + }, "node_modules/lodash": { "version": "4.17.21", "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz", @@ -3432,6 +3451,21 @@ "node": ">=12" } }, + "node_modules/markdown-it": { + "version": "13.0.2", + "resolved": "https://registry.npmjs.org/markdown-it/-/markdown-it-13.0.2.tgz", + "integrity": "sha512-FtwnEuuK+2yVU7goGn/MJ0WBZMM9ZPgU9spqlFs7/A/pDIUNSOQZhUgOqYCficIuR2QaFnrt8LHqBWsbTAoI5w==", + "dependencies": { + "argparse": "^2.0.1", + "entities": "~3.0.1", + "linkify-it": "^4.0.1", + "mdurl": "^1.0.1", + "uc.micro": "^1.0.5" + }, + "bin": { + "markdown-it": "bin/markdown-it.js" + } + }, "node_modules/md5": { "version": "2.3.0", "resolved": "https://registry.npmjs.org/md5/-/md5-2.3.0.tgz", @@ -3442,6 +3476,11 @@ "is-buffer": "~1.1.6" } }, + "node_modules/mdurl": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/mdurl/-/mdurl-1.0.1.tgz", + "integrity": "sha512-/sKlQJCBYVY9Ers9hqzKou4H6V5UWc/M59TH2dvkt+84itfnq7uFOMLpOiOS4ujvHP4etln18fmIxA5R5fll0g==" + }, "node_modules/merge-stream": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-2.0.0.tgz", @@ -4494,6 +4533,11 @@ "node": ">=4.2.0" } }, + "node_modules/uc.micro": { + "version": "1.0.6", + "resolved": "https://registry.npmjs.org/uc.micro/-/uc.micro-1.0.6.tgz", + "integrity": "sha512-8Y75pvTYkLJW2hWQHXxoqRgV7qb9B+9vFEtidML+7koHUFapnVJAZ6cKs+Qjz5Aw3aZWHMC6u0wJE3At+nSGwA==" + }, "node_modules/universalify": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.0.tgz", @@ -4695,6 +4739,17 @@ "vue": "^3.0.0" } }, + "node_modules/vue-markdown-render": { + "version": "2.2.1", + "resolved": "https://registry.npmjs.org/vue-markdown-render/-/vue-markdown-render-2.2.1.tgz", + "integrity": "sha512-XkYnC0PMdbs6Vy6j/gZXSvCuOS0787Se5COwXlepRqiqPiunyCIeTPQAO2XnB4Yl04EOHXwLx5y6IuszMWSgyQ==", + "dependencies": { + "markdown-it": "^13.0.2" + }, + "peerDependencies": { + "vue": "^3.3.4" + } + }, "node_modules/vue-template-compiler": { "version": "2.7.14", "resolved": "https://registry.npmjs.org/vue-template-compiler/-/vue-template-compiler-2.7.14.tgz", @@ -6231,8 +6286,7 @@ "argparse": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz", - "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==", - "dev": true + "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==" }, "array-union": { "version": "2.1.0", @@ -6463,6 +6517,11 @@ "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz", "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==" }, + "entities": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/entities/-/entities-3.0.1.tgz", + "integrity": "sha512-WiyBqoomrwMdFG1e0kqvASYfnlb0lp8M5o5Fw2OFq1hNZxxcNk8Ik0Xm7LxzBhuidnZB/UtBqVCgUz3kBOP51Q==" + }, "esbuild": { "version": "0.18.20", "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.18.20.tgz", @@ -7315,6 +7374,14 @@ "type-check": "~0.4.0" } }, + "linkify-it": { + "version": "4.0.1", + "resolved": "https://registry.npmjs.org/linkify-it/-/linkify-it-4.0.1.tgz", + "integrity": "sha512-C7bfi1UZmoj8+PQx22XyeXCuBlokoyWQL5pWSP+EI6nzRylyThouddufc2c1NDIcP9k5agmN9fLpA7VNJfIiqw==", + "requires": { + "uc.micro": "^1.0.1" + } + }, "lodash": { "version": "4.17.21", "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz", @@ -7349,6 +7416,18 @@ "@jridgewell/sourcemap-codec": "^1.4.15" } }, + "markdown-it": { + "version": "13.0.2", + "resolved": "https://registry.npmjs.org/markdown-it/-/markdown-it-13.0.2.tgz", + "integrity": "sha512-FtwnEuuK+2yVU7goGn/MJ0WBZMM9ZPgU9spqlFs7/A/pDIUNSOQZhUgOqYCficIuR2QaFnrt8LHqBWsbTAoI5w==", + "requires": { + "argparse": "^2.0.1", + "entities": "~3.0.1", + "linkify-it": "^4.0.1", + "mdurl": "^1.0.1", + "uc.micro": "^1.0.5" + } + }, "md5": { "version": "2.3.0", "resolved": "https://registry.npmjs.org/md5/-/md5-2.3.0.tgz", @@ -7359,6 +7438,11 @@ "is-buffer": "~1.1.6" } }, + "mdurl": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/mdurl/-/mdurl-1.0.1.tgz", + "integrity": "sha512-/sKlQJCBYVY9Ers9hqzKou4H6V5UWc/M59TH2dvkt+84itfnq7uFOMLpOiOS4ujvHP4etln18fmIxA5R5fll0g==" + }, "merge-stream": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-2.0.0.tgz", @@ -8038,6 +8122,11 @@ "integrity": "sha512-C0WQT0gezHuw6AdY1M2jxUO83Rjf0HP7Sk1DtXj6j1EwkQNZrHAg2XPWlq62oqEhYvONq5pkC2Y9oPljWToLmQ==", "devOptional": true }, + "uc.micro": { + "version": "1.0.6", + "resolved": "https://registry.npmjs.org/uc.micro/-/uc.micro-1.0.6.tgz", + "integrity": "sha512-8Y75pvTYkLJW2hWQHXxoqRgV7qb9B+9vFEtidML+7koHUFapnVJAZ6cKs+Qjz5Aw3aZWHMC6u0wJE3At+nSGwA==" + }, "universalify": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.0.tgz", @@ -8156,6 +8245,14 @@ "@vue/devtools-api": "^6.5.0" } }, + "vue-markdown-render": { + "version": "2.2.1", + "resolved": "https://registry.npmjs.org/vue-markdown-render/-/vue-markdown-render-2.2.1.tgz", + "integrity": "sha512-XkYnC0PMdbs6Vy6j/gZXSvCuOS0787Se5COwXlepRqiqPiunyCIeTPQAO2XnB4Yl04EOHXwLx5y6IuszMWSgyQ==", + "requires": { + "markdown-it": "^13.0.2" + } + }, "vue-template-compiler": { "version": "2.7.14", "resolved": "https://registry.npmjs.org/vue-template-compiler/-/vue-template-compiler-2.7.14.tgz", diff --git a/package.json b/package.json index 2ae1c3b..9bcd9d2 100644 --- a/package.json +++ b/package.json @@ -33,7 +33,8 @@ "pinia-plugin-persistedstate": "^3.1.0", "register-service-worker": "^1.7.2", "vue": "^3.3.4", - "vue-i18n": "^9.2.2" + "vue-i18n": "^9.2.2", + "vue-markdown-render": "^2.2.1" }, "devDependencies": { "@babel/types": "^7.22.11", diff --git a/src/components/DxpGitBookSearch.vue b/src/components/DxpGitBookSearch.vue index efbdea6..d5d24e1 100644 --- a/src/components/DxpGitBookSearch.vue +++ b/src/components/DxpGitBookSearch.vue @@ -1,17 +1,237 @@ \ No newline at end of file diff --git a/src/components/index.ts b/src/components/index.ts index 0671de0..131608c 100644 --- a/src/components/index.ts +++ b/src/components/index.ts @@ -15,6 +15,7 @@ import '@ionic/vue/css/flex-utils.css'; import '@ionic/vue/css/display.css'; export { default as DxpAppVersionInfo } from './DxpAppVersionInfo.vue'; +export { default as DxpGitBookSearch } from './DxpGitBookSearch.vue'; export { default as DxpImage } from './DxpImage.vue'; export { default as DxpLanguageSwitcher } from './DxpLanguageSwitcher.vue'; export { default as DxpLogin } from './DxpLogin.vue'; diff --git a/src/index.ts b/src/index.ts index 9652c92..0523b07 100644 --- a/src/index.ts +++ b/src/index.ts @@ -3,8 +3,8 @@ declare var process: any; import { createPinia } from "pinia"; import { useProductIdentificationStore } from "./store/productIdentification"; import { useAuthStore } from "./store/auth"; -import { DxpAppVersionInfo, DxpImage, DxpLanguageSwitcher, DxpLogin, DxpMenuFooterNavigation, DxpOmsInstanceNavigator, DxpProductIdentifier, DxpShopifyImg, DxpTimeZoneSwitcher, DxpUserProfile } from "./components"; -import { goToOms, getProductIdentificationValue, openGitBookSearchModal } from "./utils"; +import { DxpAppVersionInfo, DxpGitBookSearch, DxpImage, DxpLanguageSwitcher, DxpLogin, DxpMenuFooterNavigation, DxpOmsInstanceNavigator, DxpProductIdentifier, DxpShopifyImg, DxpTimeZoneSwitcher, DxpUserProfile } from "./components"; +import { goToOms, getProductIdentificationValue } from "./utils"; import { initialiseFirebaseApp } from "./utils/firebase" import piniaPluginPersistedstate from 'pinia-plugin-persistedstate' import { createI18n } from 'vue-i18n' @@ -66,6 +66,7 @@ export let dxpComponents = { }) app.component('DxpAppVersionInfo', DxpAppVersionInfo) + app.component('DxpGitBookSearch', DxpGitBookSearch) app.component('DxpImage', DxpImage) app.component('DxpLanguageSwitcher', DxpLanguageSwitcher) app.component('DxpLogin', DxpLogin) @@ -127,7 +128,6 @@ export { initialiseFirebaseApp, loginContext, notificationContext, - openGitBookSearchModal, productIdentificationContext, shopifyImgContext, translate, diff --git a/src/utils/index.ts b/src/utils/index.ts index bd2101a..c64ae21 100644 --- a/src/utils/index.ts +++ b/src/utils/index.ts @@ -53,21 +53,9 @@ const getCurrentTime = (zone: string, format = 't ZZZZ') => { return DateTime.now().setZone(zone).toFormat(format) } -const openGitBookSearchModal = async () => { - const modal = await modalController.create({ - component: DxpGitBookSearch - }) - - console.log(modal); - - - return modal.present(); -} - export { getCurrentTime, getProductIdentificationValue, goToOms, - showToast, - openGitBookSearchModal + showToast } \ No newline at end of file From 396779a9b849a8239cdfbdd7e7dcc56a8e0eb52a Mon Sep 17 00:00:00 2001 From: amansinghbais Date: Wed, 19 Jun 2024 15:27:15 +0530 Subject: [PATCH 3/4] Improved: code to use the api call from the oms-api (#301) --- src/components/DxpGitBookSearch.vue | 49 ++++++++++++++++++++++------- src/index.ts | 6 ++++ 2 files changed, 44 insertions(+), 11 deletions(-) diff --git a/src/components/DxpGitBookSearch.vue b/src/components/DxpGitBookSearch.vue index d5d24e1..3654fac 100644 --- a/src/components/DxpGitBookSearch.vue +++ b/src/components/DxpGitBookSearch.vue @@ -136,8 +136,6 @@ - - @@ -146,10 +144,10 @@ import { IonButton, IonButtons, IonChip, IonContent, IonHeader, IonIcon, IonItem, IonLabel, IonList, IonModal, IonSearchbar, IonSegment, IonSegmentButton, IonSpinner, IonTabButton, IonTitle, IonToolbar, modalController } from "@ionic/vue"; import { ref } from "vue"; import { caretForwardOutline, caretDownOutline, close, documentOutline, helpOutline, returnDownBackOutline, returnDownForwardOutline, searchOutline } from "ionicons/icons"; -import { translate } from "src" -// import { UtilService } from "@/services/UtilService"; +import { translate } from "src"; import { hasError } from "@hotwax/oms-api"; import VueMarkdown from 'vue-markdown-render'; +import { gitBookContext } from "../index" const gitBookSearchModal = ref(); @@ -164,6 +162,7 @@ const isResourceLoading = ref(false); const sources = ref([]) as any; const isResourceFetched = ref(false); +declare var process: any; function closeModal() { gitBookSearchModal.value.$el.dismiss(null, 'cancel'); @@ -174,12 +173,19 @@ function updateSegment() { searchedItems.value = []; answer.value = {}; } + async function askQuery() { isLoading.value = true; let response = {} as any; + try { - // const resp = await UtilService.askQuery({ queryString: queryString.value }); - const resp = {} as any; + const resp = await gitBookContext.askQuery({ + queryString: queryString.value, + spaceId: process.env.VUE_APP_SPACE_ID, + baseURL: process.env.VUE_APP_GITBOOK_BASE_URL, + token: process.env.VUE_APP_GITBOOK_API_KEY + }); + if(!hasError(resp)) { response = resp.data.answer; sources.value = [] @@ -193,12 +199,22 @@ async function askQuery() { answer.value = response; isLoading.value = false; } + async function searchQuery() { isLoading.value = true; let items = [] as any; + + const baseURL = process.env.VUE_APP_GITBOOK_BASE_URL + console.log(baseURL); + try { - // const resp = await UtilService.searchQuery({ queryString: queryString.value }); - const resp = {} as any; + const resp = await gitBookContext.searchQuery({ + queryString: queryString.value, + spaceId: process.env.VUE_APP_SPACE_ID, + baseURL, + token: process.env.VUE_APP_GITBOOK_API_KEY + }); + if(!hasError(resp)) { items = resp.data.items; } else { @@ -210,26 +226,37 @@ async function searchQuery() { searchedItems.value = items isLoading.value = false; } + async function fetchSources() { isResourceLoading.value = true; const list = [] as any; + const responses = await Promise.all(answer.value.sources.map((source: any) => { - // if(source.type === "page") { - // return UtilService.getGitBookPage(source.page); - // } + if(source.type === "page") { + return gitBookContext.getGitBookPage({ + pageId: source.page, + spaceId: process.env.VUE_APP_SPACE_ID, + baseURL: process.env.VUE_APP_GITBOOK_BASE_URL, + token: process.env.VUE_APP_GITBOOK_API_KEY + }); + } })) + responses.map((response: any) => { if(response.status === "fulfilled") { list.push(response.value.data) } }) + sources.value = list isResourceLoading.value = false isResourceFetched.value = true } + function redirectToDoc(item: any) { window.open(`https://docs.hotwax.co/user-guides/${item.path}`, "_blank") } + function searchRelatedQuestion(question: string) { queryString.value = question; askQuery() diff --git a/src/index.ts b/src/index.ts index 0523b07..74f8185 100644 --- a/src/index.ts +++ b/src/index.ts @@ -26,6 +26,7 @@ let shopifyImgContext = {} as any let appContext = {} as any let productIdentificationContext = {} as any let notificationContext = {} as any +let gitBookContext = {} as any let userContext = {} as any let showToast = {} as any @@ -101,6 +102,10 @@ export let dxpComponents = { notificationContext.appFirebaseVapidKey = options.appFirebaseVapidKey notificationContext.storeClientRegistrationToken = options.storeClientRegistrationToken + gitBookContext.askQuery = options.askQuery + gitBookContext.getGitBookPage = options.getGitBookPage + gitBookContext.searchQuery = options.searchQuery + loginContext.getConfig = options.getConfig loginContext.initialise = options.initialise @@ -122,6 +127,7 @@ export { DxpTimeZoneSwitcher, DxpUserProfile, getProductIdentificationValue, + gitBookContext, goToOms, i18n, imageContext, From 6d7403a3626ee0f13793aa09d64ca266d6bb9b6f Mon Sep 17 00:00:00 2001 From: amansinghbais Date: Tue, 9 Jul 2024 11:17:35 +0530 Subject: [PATCH 4/4] Improved: trigger id for the search-modal and reverted console statement (#301) --- src/components/DxpGitBookSearch.vue | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/src/components/DxpGitBookSearch.vue b/src/components/DxpGitBookSearch.vue index 3654fac..80ad901 100644 --- a/src/components/DxpGitBookSearch.vue +++ b/src/components/DxpGitBookSearch.vue @@ -1,11 +1,11 @@