diff --git a/assets/js/utils.js b/assets/js/utils.js index 6bf641f..6195d7f 100644 --- a/assets/js/utils.js +++ b/assets/js/utils.js @@ -1,8 +1,8 @@ -import { round, isBoolean, get, map, forEach, set, kebabCase, startsWith, keys, replace, isString } from 'lodash' +import { round, isBoolean, get, map, forEach, set, kebabCase, startsWith, keys, replace, isString, isArray } from 'lodash' import { format } from 'timeago.js' import { extent } from 'd3-array' import { scaleLinear, scaleThreshold } from 'd3-scale' -import { NUMBERIC_FACET_TYPES, KEY_FILTER_TYPE_DETAILS, KEY_FILTER_TYPE_HISTOGRAM } from '../../store/config' +import { KEY_ID, NUMBERIC_FACET_TYPES, KEY_FILTER_TYPE_DETAILS, KEY_FILTER_TYPE_HISTOGRAM } from '../../store/config' export const getLabel = function (value, type, precision) { // The label can be different. It’s based on the type of the column @@ -162,3 +162,16 @@ export const niceRound = function (value, max) { export const isNumericFacet = function (type) { return NUMBERIC_FACET_TYPES.includes(type) } + +export const generateLink = function (filter, urlBase) { + let link = [] + forEach(filter, ({ value, [KEY_ID]: id }) => { + if (value) { + const values = isArray(value) ? value.join('|') : value + link.push(`${id}=${values}`) + } + }) + const getUrl = window.location + const query = encodeURI(link.join('&')) + return `${getUrl.protocol}//${getUrl.host}/${urlBase.replaceAll('/', '')}${$nuxt.$route.fullPath}${query.length ? '?' : ''}${query}` +} diff --git a/components/Aside/Aside.vue b/components/Aside/Aside.vue index bed2c9e..e952738 100644 --- a/components/Aside/Aside.vue +++ b/components/Aside/Aside.vue @@ -31,6 +31,7 @@ import CSVLink from '~/components/Aside/CSVLink.vue' import copy from 'copy-to-clipboard' import { KEY_ID, KEY_FILTER, KEY_HAS_ACTIVE_FILTERS } from '~/store/config' + import { generateLink } from '~/assets/js/utils' export default { props: { @@ -70,16 +71,9 @@ 'loadFacets' ]), copyLink () { - let link = [] - forEach(this.filter, ({ value, [KEY_ID]: id }) => { - if (value) { - const values = isArray(value) ? value.join('|') : value - link.push(`${id}=${values}`) - } - }) - const getUrl = window.location - const query = encodeURI(link.join('&')) - copy(`${getUrl.protocol}//${getUrl.host}/${this.$router.options.base.replaceAll('/', '')}${$nuxt.$route.fullPath}${ query.length ? '?' : ''}${query}`) + const link = generateLink(this.filter, this.$router.options.base) + console.log(link) + copy(link) }, exportToCSV () { diff --git a/components/Aside/ExplorerLink.vue b/components/Aside/ExplorerLink.vue index fb8f901..046e8f4 100644 --- a/components/Aside/ExplorerLink.vue +++ b/components/Aside/ExplorerLink.vue @@ -6,6 +6,8 @@ import { mapState } from 'vuex' import { get, map, compact } from 'lodash' import copy from 'copy-to-clipboard' + import { generateLink } from '~/assets/js/utils' + import { KEY_FILTER } from '~/store/config' import { basket } from '~/store/index' @@ -43,7 +45,7 @@ }).then(asJson) } - function generateTemplate (runs) { + function generateTemplate (runs, link) { return { 'name': 'Senses Scenario Finder Workspace', 'description': 'Workspace created by the Senses Scenario Finder selection', @@ -56,7 +58,7 @@ 'description': '', 'showAs': 'text', 'size': 'half', - 'markdown': '# Senses Scenario Finder workspace', + 'markdown': `# Senses Scenario Finder workspace\n\nThis workspace has been generated by the Senses Scenario Finder. Find the scenario selection here: [${link}](${link})`, }, }, { @@ -101,6 +103,11 @@ isError: false } }, + computed: { + ...mapState('filter', { + filter: [KEY_FILTER] + }) + }, methods: { openExplorer () { this.isClickable = false @@ -131,7 +138,8 @@ const config = await getAppConfig(authToken, APP_NAME).catch((error) => { this.displayError(error) }) const baseUrl = config.find(e => e.path === 'baseUrl').value const uiUrl = config.find(e => e.path === 'uiUrl').value - const workspace = await createWorkspace(baseUrl, authToken, generateTemplate(runs)).catch((error) => { this.displayError(error) }) + const link = generateLink(this.filter, this.$router.options.base) + const workspace = await createWorkspace(baseUrl, authToken, generateTemplate(runs, link)).catch((error) => { this.displayError(error) }) const shareUrl = `${uiUrl}/#/workspaces/share/${workspace.accessToken}` copy(shareUrl) this.message = 'URL copied to clipboard'