diff --git a/src/assets/licenses/remix.svg b/src/assets/licenses/remix.svg
new file mode 100644
index 0000000000..21c8d95a6a
--- /dev/null
+++ b/src/assets/licenses/remix.svg
@@ -0,0 +1,5 @@
+
diff --git a/src/assets/licenses/sampling-plus.svg b/src/assets/licenses/sampling-plus.svg
new file mode 100644
index 0000000000..ea3b134b37
--- /dev/null
+++ b/src/assets/licenses/sampling-plus.svg
@@ -0,0 +1,5 @@
+
diff --git a/src/assets/licenses/sampling.svg b/src/assets/licenses/sampling.svg
new file mode 100644
index 0000000000..bdb78817a4
--- /dev/null
+++ b/src/assets/licenses/sampling.svg
@@ -0,0 +1,5 @@
+
diff --git a/src/components/LicenseElements.vue b/src/components/LicenseElements.vue
deleted file mode 100644
index 508dfee3d1..0000000000
--- a/src/components/LicenseElements.vue
+++ /dev/null
@@ -1,55 +0,0 @@
-
-
-
-
-
diff --git a/src/components/VFilters/VFilterChecklist.vue b/src/components/VFilters/VFilterChecklist.vue
index ec4aed6616..f4d1152cac 100644
--- a/src/components/VFilters/VFilterChecklist.vue
+++ b/src/components/VFilters/VFilterChecklist.vue
@@ -1,5 +1,5 @@
-
diff --git a/src/components/VFilters/VLicenseExplanation.vue b/src/components/VFilters/VLicenseExplanation.vue
new file mode 100644
index 0000000000..b5c0a6cb9e
--- /dev/null
+++ b/src/components/VFilters/VLicenseExplanation.vue
@@ -0,0 +1,88 @@
+
+
+
+ {{
+ $t('filters.license-explanation.license-definition')
+ }}
+ {{
+ $t('filters.license-explanation.mark-definition', {
+ mark: license.toUpperCase(),
+ })
+ }}
+
+
+
+
+
+
+ {{
+ $t('filters.license-explanation.more.read-more')
+ }}
+
+ {{ license.toUpperCase() }}
+
+
+
+
+
diff --git a/src/components/VFilters/VLicenseExplanationTooltip.vue b/src/components/VFilters/VLicenseExplanationTooltip.vue
deleted file mode 100644
index 2166f15014..0000000000
--- a/src/components/VFilters/VLicenseExplanationTooltip.vue
+++ /dev/null
@@ -1,171 +0,0 @@
-
-
-
-
-
-
- {{
- $t('filters.license-explanation.link')
- }}
-
-
-
-
- {{
- $t('filters.license-explanation.link')
- }}
-
-
-
-
-
-
-
-
diff --git a/src/components/VFilters/meta/VLicenseExplanation.stories.mdx b/src/components/VFilters/meta/VLicenseExplanation.stories.mdx
new file mode 100644
index 0000000000..991015a222
--- /dev/null
+++ b/src/components/VFilters/meta/VLicenseExplanation.stories.mdx
@@ -0,0 +1,39 @@
+import {
+ ArgsTable,
+ Canvas,
+ Description,
+ Meta,
+ Story,
+} from '@storybook/addon-docs'
+
+import VLicenseExplanation from '~/components/VFilters/VLicenseExplanation.vue'
+
+import { ALL_LICENSES } from '~/constants/license'
+
+
+
+export const Template = (args, { argTypes }) => ({
+ template: ``,
+ components: { VLicenseExplanation },
+ props: Object.keys(argTypes),
+})
+
+# VLicenseExplanation
+
+
+
+
+
+
diff --git a/src/components/VIconButton/VIconButton.vue b/src/components/VIconButton/VIconButton.vue
index bb6c665c27..99920a3ded 100644
--- a/src/components/VIconButton/VIconButton.vue
+++ b/src/components/VIconButton/VIconButton.vue
@@ -1,5 +1,7 @@
-
-
+
diff --git a/src/components/VMediaInfo/VMediaLicense.vue b/src/components/VMediaInfo/VMediaLicense.vue
index 1b80e5cca5..c30fbac99e 100644
--- a/src/components/VMediaInfo/VMediaLicense.vue
+++ b/src/components/VMediaInfo/VMediaLicense.vue
@@ -15,7 +15,7 @@
-
+
-
+
-
-
diff --git a/src/constants/license.js b/src/constants/license.js
index 287229a2d5..f5cc5591fc 100644
--- a/src/constants/license.js
+++ b/src/constants/license.js
@@ -11,6 +11,8 @@ export const NON_CC_LICENSES = ['cc0', 'pdm']
export const DEPRECATED_LICENSES = ['nc-sampling+', 'sampling+']
+export const ACTIVE_LICENSES = [...NON_CC_LICENSES, ...CC_LICENSES]
+
export const ALL_LICENSES = [
...CC_LICENSES,
...NON_CC_LICENSES,
diff --git a/src/locales/en.json b/src/locales/en.json
index d7069de086..42c51c7aa0 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -365,9 +365,13 @@
"creator": "Creator"
},
"license-explanation": {
- "tool": "Read more about the tool {link}.",
- "license": "Read more about the license {link}.",
- "link": "here"
+ "license-definition": "License definition",
+ "mark-definition": "{mark} definition",
+ "more": {
+ "license": "{read-more} about this license.",
+ "mark": "{read-more} about {mark}.",
+ "read-more": "Read more"
+ }
},
"aria": {
"remove-filter": "Remove {label} filter"
@@ -408,7 +412,8 @@
"nd": "No derivatives or adaptations permitted.",
"sa": "Share adaptations under the same terms.",
"cc0": "This work has been marked as dedicated to the public domain.",
- "pdm": "This work is marked as being in the public domain."
+ "pdm": "This work is marked as being in the public domain.",
+ "sampling+": "Samples, mash-ups, creative transformations permitted."
},
"aria": {
"close": "close",
diff --git a/src/locales/po-files/openverse.pot b/src/locales/po-files/openverse.pot
index 665b9ade2a..eaa749ee42 100644
--- a/src/locales/po-files/openverse.pot
+++ b/src/locales/po-files/openverse.pot
@@ -4,7 +4,7 @@ msgid ""
msgstr ""
"Project-Id-Version: Openverse \n"
"Report-Msgid-Bugs-To: https://github.com/wordpress/openverse/issues \n"
-"POT-Creation-Date: 2022-02-22T15:15:29+00:00\n"
+"POT-Creation-Date: 2022-02-22T20:16:03+00:00\n"
"MIME-Version: 1.0\n"
"Content-Type: text/plain; charset=UTF-8\n"
"Content-Transfer-Encoding: 8bit\n"
@@ -62,7 +62,7 @@ msgctxt "search-type.see-audio"
msgid "See all audio"
msgstr ""
-#: src/components/VModal/VMobileModalContent.vue:28
+#: src/components/VFilters/VFilterChecklist.vue:41
msgctxt "modal.close"
msgid "Close"
msgstr ""
@@ -236,7 +236,7 @@ msgid "Loading..."
msgstr ""
#. Do not translate words between ### ###.
-#: src/components/VAudioThumbnail/VAudioThumbnail.vue:102
+#: src/components/VAudioThumbnail/VAudioThumbnail.vue:54
msgctxt "audio-thumbnail.alt"
msgid "Cover art for \"###title###\" by ###creator###"
msgstr ""
@@ -730,7 +730,7 @@ msgctxt "browse-page.aria.remove-filter"
msgid "remove filter"
msgstr ""
-#: src/components/VFilters/VFilterChecklist.vue:26
+#: src/components/VFilters/VFilterChecklist.vue:31
msgctxt "browse-page.aria.license-explanation"
msgid "license explanation"
msgstr ""
@@ -749,7 +749,6 @@ msgctxt "browse-page.aria.relevance.no"
msgid "relevant result? answer: no"
msgstr ""
-#: src/components/VFilters/VLicenseExplanationTooltip.vue:8
msgctxt "browse-page.license-description.title"
msgid "License CC"
msgstr ""
@@ -778,6 +777,10 @@ msgctxt "browse-page.license-description.pdm"
msgid "This work is marked as being in the public domain."
msgstr ""
+msgctxt "browse-page.license-description.sampling+"
+msgid "Samples, mash-ups, creative transformations permitted."
+msgstr ""
+
#. Do not translate words between ### ###.
msgctxt "browse-page.search-form.placeholder"
msgid "Search all ###type###"
@@ -867,24 +870,33 @@ msgctxt "filters.aria.remove-filter"
msgid "Remove ###label### filter"
msgstr ""
+#: src/components/VFilters/VLicenseExplanation.vue:5
+msgctxt "filters.license-explanation.license-definition"
+msgid "License definition"
+msgstr ""
+
#. Do not translate words between ### ###.
-#: src/components/VFilters/VLicenseExplanationTooltip.vue:12
-msgctxt "filters.license-explanation.tool"
-msgid "Read more about the tool ###link###."
+#: src/components/VFilters/VLicenseExplanation.vue:8
+msgctxt "filters.license-explanation.mark-definition"
+msgid "###mark### definition"
msgstr ""
#. Do not translate words between ### ###.
-#: src/components/VFilters/VLicenseExplanationTooltip.vue:24
-msgctxt "filters.license-explanation.license"
-msgid "Read more about the license ###link###."
+msgctxt "filters.license-explanation.more.license"
+msgid "###read-more### about this license."
msgstr ""
-#: src/components/VFilters/VLicenseExplanationTooltip.vue:20
-msgctxt "filters.license-explanation.link"
-msgid "here"
+#. Do not translate words between ### ###.
+msgctxt "filters.license-explanation.more.mark"
+msgid "###read-more### about ###mark###."
+msgstr ""
+
+#: src/components/VFilters/VLicenseExplanation.vue:30
+msgctxt "filters.license-explanation.more.read-more"
+msgid "Read more"
msgstr ""
-#: src/components/VFilters/VFilterChecklist.vue:74
+#: src/components/VFilters/VFilterChecklist.vue:88
msgctxt "filters.search-by.title"
msgid "Search By"
msgstr ""
diff --git a/src/store/search.js b/src/store/search.js
index 986bdde747..f4e8074f71 100644
--- a/src/store/search.js
+++ b/src/store/search.js
@@ -29,6 +29,7 @@ import {
SET_QUERY,
SET_SEARCH_TYPE,
} from '~/constants/mutation-types'
+import { ACTIVE_LICENSES } from '~/constants/license'
/**
* List of filters available for each search type. The order of the keys
@@ -85,16 +86,7 @@ export const mediaSpecificFilters = {
/** @type {import('./types').Filters} */
export const filterData = deepFreeze({
- licenses: createInitialFilters('licenses', [
- 'cc0',
- 'pdm',
- 'by',
- 'by-sa',
- 'by-nc',
- 'by-nd',
- 'by-nc-sa',
- 'by-nc-nd',
- ]),
+ licenses: createInitialFilters('licenses', ACTIVE_LICENSES),
licenseTypes: createInitialFilters('license-types', [
'commercial',
'modification',
diff --git a/src/utils/license.js b/src/utils/license.js
index 800a8649ee..9e3557cc11 100644
--- a/src/utils/license.js
+++ b/src/utils/license.js
@@ -31,9 +31,8 @@ export const getFullLicenseName = (license, license_version) => {
/**
* CC licenses have different legal status from the public domain marks
* such as CC0 and PDM, and need different wording.
- * Returns false if licenseOrMark is CC0 or PDM
* @param {License|LicenseName|''} licenseOrMark
- * @return {boolean}
+ * @return {asserts licenseOrMark is Exclude<'pdm' | 'cc0', License | LicenseName | ''>} false if licenseOrMark is CC0 or PDM, true otherwise
*/
export const isLicense = (licenseOrMark = '') => {
return !['pdm', 'cc0'].includes(licenseOrMark.toLowerCase())
diff --git a/test/unit/specs/components/v-popover.spec.js b/test/unit/specs/components/v-popover.spec.js
index a30ebc3254..dd4552f0b0 100644
--- a/test/unit/specs/components/v-popover.spec.js
+++ b/test/unit/specs/components/v-popover.spec.js
@@ -58,7 +58,9 @@ const expectOpen = () => {
}
const expectClosed = () => {
- expect(queryPopover()).toBe(null)
+ expect(queryPopover().parentElement.parentElement.style.display).toEqual(
+ 'none'
+ )
}
describe('VPopover', () => {