diff --git a/components.d.ts b/components.d.ts index aa8938d1c4..4c2ca150c0 100644 --- a/components.d.ts +++ b/components.d.ts @@ -212,6 +212,12 @@ declare module 'vue' { EmptyStateAction: typeof import('./src/components/EmptyState/EmptyStateAction.vue')['default'] EmptyStateImage: typeof import('./src/components/EmptyState/EmptyStateImage.vue')['default'] EmptyStateLabel: typeof import('./src/components/EmptyState/EmptyStateLabel.vue')['default'] + EntityPopover: typeof import('./src/components/EntityPopover/EntityPopover.vue')['default'] + EntityPopoverInfo: typeof import('./src/components/EntityPopover/EntityPopoverInfo.vue')['default'] + EntityPopoverMentionExcerpt: typeof import('./src/components/EntityPopover/EntityPopoverMentionExcerpt.vue')['default'] + EntityPopoverMentionOccurrences: typeof import('./src/components/EntityPopover/EntityPopoverMentionOccurrences.vue')['default'] + EntityPopoverMentions: typeof import('./src/components/EntityPopover/EntityPopoverMentions.vue')['default'] + EntityPopoverTabs: typeof import('./src/components/EntityPopover/EntityPopoverTabs.vue')['default'] Extensions: typeof import('./src/components/Extensions.vue')['default'] ExtractingForm: typeof import('./src/components/ExtractingForm.vue')['default'] ExtractingFormOcrControl: typeof import('./src/components/ExtractingFormOcrControl.vue')['default'] diff --git a/src/components/EntityPopover/EntityPopover.vue b/src/components/EntityPopover/EntityPopover.vue new file mode 100644 index 0000000000..e5cd0b123f --- /dev/null +++ b/src/components/EntityPopover/EntityPopover.vue @@ -0,0 +1,69 @@ + + diff --git a/src/components/EntityPopover/EntityPopoverInfo.vue b/src/components/EntityPopover/EntityPopoverInfo.vue new file mode 100644 index 0000000000..e3b8cf1854 --- /dev/null +++ b/src/components/EntityPopover/EntityPopoverInfo.vue @@ -0,0 +1,33 @@ + + + + diff --git a/src/components/EntityPopover/EntityPopoverMentionExcerpt.vue b/src/components/EntityPopover/EntityPopoverMentionExcerpt.vue new file mode 100644 index 0000000000..6612b69182 --- /dev/null +++ b/src/components/EntityPopover/EntityPopoverMentionExcerpt.vue @@ -0,0 +1,32 @@ + + + + + diff --git a/src/components/EntityPopover/EntityPopoverMentionOccurrences.vue b/src/components/EntityPopover/EntityPopoverMentionOccurrences.vue new file mode 100644 index 0000000000..01a002cb7f --- /dev/null +++ b/src/components/EntityPopover/EntityPopoverMentionOccurrences.vue @@ -0,0 +1,33 @@ + + + + + diff --git a/src/components/EntityPopover/EntityPopoverMentions.vue b/src/components/EntityPopover/EntityPopoverMentions.vue new file mode 100644 index 0000000000..3b98ad1fc1 --- /dev/null +++ b/src/components/EntityPopover/EntityPopoverMentions.vue @@ -0,0 +1,24 @@ + + diff --git a/src/components/EntityPopover/EntityPopoverTabs.vue b/src/components/EntityPopover/EntityPopoverTabs.vue new file mode 100644 index 0000000000..4b6e6ffad7 --- /dev/null +++ b/src/components/EntityPopover/EntityPopoverTabs.vue @@ -0,0 +1,54 @@ + + diff --git a/src/lang/en.json b/src/lang/en.json index 362ce31a91..7bcf4777df 100644 --- a/src/lang/en.json +++ b/src/lang/en.json @@ -103,6 +103,19 @@ "sectionContentType": "What's the document's type", "sectionDescription": "Once downloaded, how do I open it ?" }, + "entityPopoverInfo": { + "content": "This entity was extracted with:", + "model": "{model} model", + "language": "in {language} language." + }, + "entityPopoverMentionOccurrences": { + "occurrences": "This mention appears {nbMentions} times | This mention appears {nbMentions} time | This mention appears {nbMentions} times", + "projectList": "in {n} projects | in {n} project | in {n} projects:" + }, + "entityPopoverTabs": { + "mentions": "Mentions", + "info": "Info" + }, "error": { "title": "Something's wrong here", "description": "An error has occurred. Please try again later or contact your administrator if the problem persists.", diff --git a/src/stories/components/EntityPopover/EntityPopover.stories.js b/src/stories/components/EntityPopover/EntityPopover.stories.js new file mode 100644 index 0000000000..0bdb2fe7a7 --- /dev/null +++ b/src/stories/components/EntityPopover/EntityPopover.stories.js @@ -0,0 +1,38 @@ +import EntityPopover from '@/components/EntityPopover/EntityPopover' + +export default { + title: 'Components/EntityPopover/EntityPopover', + component: EntityPopover, + tags: ['autodocs'], + args: { + language: 'English', + model: 'CoreNLP', + mention: 'Bruno Mars', + excerpt: 'Lorem ipsum Bruno Mars dolor ipset', + nbMentions: 5033, + projects: ['banana papers', 'citrus confidential'] + }, + render: (args) => ({ + components: { + EntityPopover + }, + setup: () => ({ args }), + computed: { + trigger() { + return `btn-${this.$.uid}` + }, + title() { + return args.document.title + } + }, + template: ` +
+ + +
+ ` + }) +} +export const Default = {} diff --git a/src/stories/components/EntityPopover/EntityPopoverInfo.stories.js b/src/stories/components/EntityPopover/EntityPopoverInfo.stories.js new file mode 100644 index 0000000000..145a2133cf --- /dev/null +++ b/src/stories/components/EntityPopover/EntityPopoverInfo.stories.js @@ -0,0 +1,12 @@ +import EntityPopoverInfo from '@/components/EntityPopover/EntityPopoverInfo' + +export default { + title: 'Components/EntityPopover/EntityPopoverInfo', + component: EntityPopoverInfo, + tags: ['autodocs'], + args: { + language: 'english', + model: 'CoreNLP' + } +} +export const Default = {} diff --git a/src/stories/components/EntityPopover/EntityPopoverMentionExcerpt.stories.js b/src/stories/components/EntityPopover/EntityPopoverMentionExcerpt.stories.js new file mode 100644 index 0000000000..fef496e08c --- /dev/null +++ b/src/stories/components/EntityPopover/EntityPopoverMentionExcerpt.stories.js @@ -0,0 +1,12 @@ +import EntityPopoverMentionExcerpt from '@/components/EntityPopover/EntityPopoverMentionExcerpt' + +export default { + title: 'Components/EntityPopover/EntityPopoverMentionExcerpt', + component: EntityPopoverMentionExcerpt, + tags: ['autodocs'], + args: { + mention: 'Bruno Mars', + excerpt: 'Lorem ipsum Bruno Mars dolor ipset ' + } +} +export const Default = {} diff --git a/src/stories/components/EntityPopover/EntityPopoverMentionOccurrences.stories.js b/src/stories/components/EntityPopover/EntityPopoverMentionOccurrences.stories.js new file mode 100644 index 0000000000..a0dba3a014 --- /dev/null +++ b/src/stories/components/EntityPopover/EntityPopoverMentionOccurrences.stories.js @@ -0,0 +1,12 @@ +import EntityPopoverMentionOccurrences from '@/components/EntityPopover/EntityPopoverMentionOccurrences' + +export default { + title: 'Components/EntityPopover/EntityPopoverMentionOccurrences', + component: EntityPopoverMentionOccurrences, + tags: ['autodocs'], + args: { + nbMentions: 5033, + projects: ['banana papers', 'citrus confidential'] + } +} +export const Default = {} diff --git a/src/stories/components/EntityPopover/EntityPopoverMentions.stories.js b/src/stories/components/EntityPopover/EntityPopoverMentions.stories.js new file mode 100644 index 0000000000..2d1ad5de9e --- /dev/null +++ b/src/stories/components/EntityPopover/EntityPopoverMentions.stories.js @@ -0,0 +1,33 @@ +import { computed, ref } from 'vue' + +import EntityPopoverMentions from '@/components/EntityPopover/EntityPopoverMentions' +const excerpt = 'Lorem ipsum Bruno Mars dolor ipset' +const excerpts = [excerpt, 'Lorem ipsum dolor ipset Bruno Mars', 'Bruno Mars Lorem ipsum dolor ipset'] +export default { + title: 'Components/EntityPopover/EntityPopoverMentions', + component: EntityPopoverMentions, + tags: ['autodocs'], + args: { + mention: 'Bruno Mars', + projects: ['banana papers', 'citrus confidential'], + nbMentions: excerpts.length, + excerpt, + excerpts + }, + render: (args) => ({ + components: { + EntityPopoverMentions + }, + setup: () => { + const index = ref(1) + const current = computed(() => excerpts[index.value - 1]) + return { args, index, current } + }, + + template: ` + + + ` + }) +} +export const Default = {} diff --git a/src/stories/components/EntityPopover/EntityPopoverTabs.stories.js b/src/stories/components/EntityPopover/EntityPopoverTabs.stories.js new file mode 100644 index 0000000000..9773cc6d04 --- /dev/null +++ b/src/stories/components/EntityPopover/EntityPopoverTabs.stories.js @@ -0,0 +1,16 @@ +import EntityPopoverTabs from '@/components/EntityPopover/EntityPopoverTabs' + +export default { + title: 'Components/EntityPopover/EntityPopoverTabs', + component: EntityPopoverTabs, + tags: ['autodocs'], + args: { + language: 'english', + model: 'CoreNLP', + mention: 'Bruno Mars', + excerpt: 'Lorem ipsum Bruno Mars dolor ipset ', + nbMentions: 5033, + projects: ['banana papers', 'citrus confidential'] + } +} +export const Default = {}