[WIP][ENG-4467]Search result card

app/models/index-card.ts

@@ -12,6 +12,7 @@ export default class IndexCardModel extends Model {
 
     @attr('array') resourceType!: string[];
     @attr('array') resourceIdentifier!: string[];
+    // TODO: can we add a type for resourceMetadata?
     @attr('object') resourceMetadata!: any;
 
     @hasMany('index-card', { inverse: null })

app/models/search-result.ts

@@ -1,25 +1,209 @@
-import Model, { AsyncBelongsTo, attr, belongsTo } from '@ember-data/model';
+import Model, { attr, belongsTo } from '@ember-data/model';
+import { inject as service } from '@ember/service';
+import { htmlSafe } from '@ember/template';
+import IntlService from 'ember-intl/services/intl';
 
 import IndexCardModel from './index-card';
 
+const textMatchEvidenceType = 'https://share.osf.io/vocab/2023/trove/TextMatchEvidence';
+
 export interface IriMatchEvidence {
-    '@type': 'IriMatchEvidence';
+    '@type': [string];
     matchingIri: string;
-    propertyPath: string[];
+    osfmapPropertyPath: string[];
 }
 
 export interface TextMatchEvidence {
-    '@type': 'TextMatchEvidence';
+    '@type': [string];
     matchingHighlight: string;
-    propertyPath: string[];
+    osfmapPropertyPath: string[];
 }
 
 export default class SearchResultModel extends Model {
+    @service intl!: IntlService;
+
     @attr('array') matchEvidence!: Array<IriMatchEvidence | TextMatchEvidence>;
     @attr('number') recordResultCount!: number;
 
     @belongsTo('index-card', { inverse: null })
-    indexCard!: AsyncBelongsTo<IndexCardModel> | IndexCardModel;
+    indexCard!: IndexCardModel;
+
+    get resourceMetadata() {
+        return this.indexCard.get('resourceMetadata');
+    }
+
+    // TODO: double check how matchEvidence works
+    get context() {
+        if (this.matchEvidence) {
+            const matchEvidenceString = this.matchEvidence.reduce(
+                (acc, current) => acc.concat(
+                    `${current.osfmapPropertyPath[0]}: ${current['@type'][0] === textMatchEvidenceType
+                        ? (current as TextMatchEvidence).matchingHighlight
+                        : (current as IriMatchEvidence).matchingIri}; `,
+                ),
+                '',
+            );
+            return htmlSafe(matchEvidenceString);
+        }
+        return null;
+    }
+
+    get displayTitle() {
+        if (this.resourceType === 'user') {
+            return this.resourceMetadata['name'][0]['@value'];
+        } else if (this.resourceType === 'file') {
+            return this.resourceMetadata['fileName'][0]['@value'];
+        }
+        return this.resourceMetadata['title']?.[0]['@value'];
+    }
+
+    get description() {
+        return this.resourceMetadata.description?.[0]?.['@value'];
+    }
+
+    get absoluteUrl() {
+        return this.resourceMetadata['@id'];
+    }
+
+    // returns list of contributors for osf objects
+    // returns list of affiliated institutions for osf users
+    get affiliatedEntities() {
+        if (this.resourceType === 'user') {
+            // return something
+        } else {
+            return this.resourceMetadata.creator?.map( (item:any) => item.name[0]['@value']);
+        }
+    }
+
+    get dateFields() {
+        switch (this.resourceType) {
+        case 'user':
+            return [];
+        case 'registration':
+        case 'registration_component':
+            return [
+                {
+                    label: this.intl.t('osf-components.search-result-card.date_registered'),
+                    date: this.resourceMetadata.dateCreated?.[0]['@value'],
+                },
+                {
+                    label: this.intl.t('osf-components.search-result-card.date_modified'),
+                    date: this.resourceMetadata.dateModified?.[0]['@value'],
+                },
+            ];
+        default:
+            return [
+                {
+                    label: this.intl.t('osf-components.search-result-card.date_created'),
+                    date: this.resourceMetadata.dateCreated?.[0]['@value'],
+                },
+                {
+                    label: this.intl.t('osf-components.search-result-card.date_modified'),
+                    date: this.resourceMetadata.dateModified?.[0]['@value'],
+                },
+            ];
+        }
+    }
+
+    get isPartOf() {
+        const isPartOf = this.resourceMetadata.isPartOf;
+        if (isPartOf) {
+            return {
+                title: this.resourceMetadata.isPartOf?.[0]?.title?.[0]?.['@value'],
+                absoluteUrl: this.resourceMetadata.isPartOf?.[0]?.['@id'],
+            };
+        }
+        return null;
+    }
+
+    get isPartOfCollection() {
+        const isPartOfCollection = this.resourceMetadata.isPartOfCollection;
+        if (isPartOfCollection) {
+            return {
+                title: this.resourceMetadata.isPartOfCollection?.[0]?.title?.[0]?.['@value'],
+                absoluteUrl: this.resourceMetadata.isPartOfCollection?.[0]?.['@id'],
+            };
+        }
+        return null;
+    }
+
+    get language() {
+        return this.resourceMetadata.language;
+    }
+
+    get funders() {
+        if (this.resourceMetadata.funder) {
+            return this.resourceMetadata.funder.map( (item: any) => ({
+                name: item.name[0]['@value'],
+                identifier: item.identifier?.[0]['@value'],
+            }));
+        }
+        return null;
+    }
+
+    get provider() {
+        if (this.resourceMetadata.publisher) {
+            return {
+                name: this.resourceMetadata.publisher[0].name[0]['@value'],
+                identifier: this.resourceMetadata.publisher[0]['@id'],
+            };
+        }
+        return null;
+    }
+
+    get doi() {
+        return this.indexCard.get('resourceIdentifier').filter(id => id.includes('https://doi.org'));
+    }
+
+    get license() {
+        if (this.resourceMetadata.rights) {
+            return {
+                name: this.resourceMetadata.rights?.[0].name[0]['@value'],
+                identifier: this.resourceMetadata.rights?.[0]['@id'],
+            };
+        }
+        return null;
+    }
+
+    get resourceType() {
+        const types = this.resourceMetadata.resourceType.map( (item: any) => item['@id']);
+        if (types.includes('Project')) {
+            return 'project';
+        } else if (types.includes('Registration')) {
+            return 'registration';
+        } else if (types.includes('Preprint')) {
+            return 'preprint';
+        } else if (types.includes('ProjectComponent')) {
+            return 'project_component';
+        } else if (types.includes('RegistrationComponent')) {
+            return 'registration_component';
+        } else if (types.includes('Person')) {
+            return 'user';
+        } else if(types.includes('File')) {
+            return 'file';
+        }
+        return 'unknown';
+    }
+
+    get hasDataResource() {
+        return this.resourceMetadata.hasDataResource;
+    }
+
+    get hasAnalyticCodeResource() {
+        return this.resourceMetadata.hasAnalyticCodeResource;
+    }
+
+    get hasMaterialsResource() {
+        return this.resourceMetadata.hasMaterialsResource;
+    }
+
+    get hasPapersResource() {
+        return this.resourceMetadata.hasPapersResource;
+    }
+
+    get hasSupplementalResource() {
+        return this.resourceMetadata.hasSupplementalResource;
+    }
 }
 
 declare module 'ember-data/types/registries/model' {

lib/osf-components/addon/components/node-card/template.hbs

@@ -271,6 +271,7 @@
                     @hasPapers={{@node.hasPapers}}
                     @hasSupplements={{@node.hasSupplements}}
                     @registration={{@node.id}}
+                    @verticalLayout={{true}}
                 />
             </div>
         {{/if}}

lib/osf-components/addon/components/open-badges-list/open-badge-card/template.hbs

@@ -2,8 +2,9 @@
     <OsfLink
         data-analytics-name='Badge link to registration'
         data-test-registration-link='{{@registration}}'
-        @route='registries.overview.resources'
-        @models={{array @registration}}
+        @route={{if @registration 'registries.overview.resources'}}
+        @models={{if @registration (array @registration)}}
+        @href={{if @absoluteUrl (concat @absoluteUrl 'resources')}}
     >
         <span
             data-test-badge-icon={{@resourceType}}

lib/osf-components/addon/components/open-badges-list/styles.scss

@@ -2,3 +2,8 @@
     font-weight: 700;
     margin-top: 0;
 }
+
+.horizontal-layout {
+    display: flex;
+    gap: 10px;
+}

lib/osf-components/addon/components/open-badges-list/template.hbs

@@ -1,37 +1,85 @@
-<div data-test-badge-list local-class='badgeList'>
-    {{#unless this.isMobile}}
-        <h5 data-test-badge-list-title local-class='title'>
-            {{t 'osf-components.open-badges-list.title'}}
-        </h5>
-    {{/unless}}
-    <OpenBadgesList::OpenBadgeCard
-        @hasResource={{@hasData}}
-        @resourceType='data'
-        @isMobile={{this.isMobile}}
-        @registration={{@registration}}
-    />
-    <OpenBadgesList::OpenBadgeCard
-        @hasResource={{@hasAnalyticCode}}
-        @resourceType='analytic_code'
-        @isMobile={{this.isMobile}}
-        @registration={{@registration}}
-    />
-    <OpenBadgesList::OpenBadgeCard
-        @hasResource={{@hasMaterials}}
-        @resourceType='materials'
-        @isMobile={{this.isMobile}}
-        @registration={{@registration}}
-    />
-    <OpenBadgesList::OpenBadgeCard
-        @hasResource={{@hasPapers}}
-        @resourceType='papers'
-        @isMobile={{this.isMobile}}
-        @registration={{@registration}}
-    />
-    <OpenBadgesList::OpenBadgeCard
-        @hasResource={{@hasSupplements}}
-        @resourceType='supplements'
-        @isMobile={{this.isMobile}}
-        @registration={{@registration}}
-    />
-</div>
+{{#if @verticalLayout}}
+    <div data-test-badge-list local-class='badgeList'>
+        {{#unless this.isMobile}}
+            <h5 data-test-badge-list-title local-class='title'>
+                {{t 'osf-components.open-badges-list.title'}}
+            </h5>
+        {{/unless}}
+        <OpenBadgesList::OpenBadgeCard
+            @hasResource={{@hasData}}
+            @resourceType='data'
+            @isMobile={{this.isMobile}}
+            @registration={{@registration}}
+            @absoluteUrl={{@absoluteUrl}}
+        />
+        <OpenBadgesList::OpenBadgeCard
+            @hasResource={{@hasAnalyticCode}}
+            @resourceType='analytic_code'
+            @isMobile={{this.isMobile}}
+            @registration={{@registration}}
+            @absoluteUrl={{@absoluteUrl}}
+        />
+        <OpenBadgesList::OpenBadgeCard
+            @hasResource={{@hasMaterials}}
+            @resourceType='materials'
+            @isMobile={{this.isMobile}}
+            @registration={{@registration}}
+            @absoluteUrl={{@absoluteUrl}}
+        />
+        <OpenBadgesList::OpenBadgeCard
+            @hasResource={{@hasPapers}}
+            @resourceType='papers'
+            @isMobile={{this.isMobile}}
+            @registration={{@registration}}
+            @absoluteUrl={{@absoluteUrl}}
+        />
+        <OpenBadgesList::OpenBadgeCard
+            @hasResource={{@hasSupplements}}
+            @resourceType='supplements'
+            @isMobile={{this.isMobile}}
+            @registration={{@registration}}
+            @absoluteUrl={{@absoluteUrl}}
+        />
+    </div>
+{{else}}
+    <h5 data-test-badge-list-title local-class='title'>
+        {{t 'osf-components.open-badges-list.title'}}
+    </h5>
+    <div local-class='horizontal-layout'>
+        <OpenBadgesList::OpenBadgeCard
+            @hasResource={{@hasData}}
+            @resourceType='data'
+            @isMobile={{this.isMobile}}
+            @registration={{@registration}}
+            @absoluteUrl={{@absoluteUrl}}
+        />
+        <OpenBadgesList::OpenBadgeCard
+            @hasResource={{@hasAnalyticCode}}
+            @resourceType='analytic_code'
+            @isMobile={{this.isMobile}}
+            @registration={{@registration}}
+            @absoluteUrl={{@absoluteUrl}}
+        />
+        <OpenBadgesList::OpenBadgeCard
+            @hasResource={{@hasMaterials}}
+            @resourceType='materials'
+            @isMobile={{this.isMobile}}
+            @registration={{@registration}}
+            @absoluteUrl={{@absoluteUrl}}
+        />
+        <OpenBadgesList::OpenBadgeCard
+            @hasResource={{@hasPapers}}
+            @resourceType='papers'
+            @isMobile={{this.isMobile}}
+            @registration={{@registration}}
+            @absoluteUrl={{@absoluteUrl}}
+        />
+        <OpenBadgesList::OpenBadgeCard
+            @hasResource={{@hasSupplements}}
+            @resourceType='supplements'
+            @isMobile={{this.isMobile}}
+            @registration={{@registration}}
+            @absoluteUrl={{@absoluteUrl}}
+        />
+    </div>
+{{/if}}

lib/osf-components/addon/components/search-page/template.hbs

@@ -221,6 +221,9 @@ as |layout|>
                 </div>
             </div>
         {{/unless}}
+        {{#each this.searchResults as |item|}}
+            <SearchResultCard @result={{item}} />
+        {{/each}}
     </layout.main>
 </OsfLayout>
 {{#if this.showTooltip1}}