Develop 202606a

app/adapters/node-mapcore-group.ts

@@ -0,0 +1,17 @@
+import OsfAdapter from './osf-adapter'; // Import OsfAdapter
+
+export default class NodeMapcoreGroupAdapter extends OsfAdapter {
+    urlForQuery(query: any, modelName: string) {
+        const { nodeId } = query;
+        if (nodeId) {
+            return `${this.host || ''}/v2/nodes/${nodeId}/map_core/groups`;
+        }
+        return super.urlForQuery(query, modelName as any);
+    }
+}
+
+declare module 'ember-data/types/registries/adapter' {
+    export default interface AdapterRegistry {
+        'node-mapcore-group': NodeMapcoreGroupAdapter;
+    } // eslint-disable-line semi
+}

app/dashboard/controller.ts

@@ -89,7 +89,7 @@ export default class Dashboard extends Controller {
         const user: User = yield this.currentUser.user;
 
         const nodes: QueryHasManyResult<Node> = yield user.queryHasMany('sparseNodes', {
-            embed: ['parent', 'root'],
+            embed: ['parent', 'root', 'creator'],
             fields: {
                 users: 'full_name,given_name,middle_names,family_name',
                 'sparse-nodes': 'id,title,date_modified,bibliographic_contributors,parent,root,creator',

app/dashboard/template.hbs

@@ -19,7 +19,7 @@
     <div local-class='quickSearch'>
         <div class='container p-t-lg'>
             <div class='row m-t-lg {{if (or (gt this.nodes.length 9) this.loading) (local-class 'quick-search-contents')}}'>
-                <div class='col-md-10 col-md-offset-1 col-lg-8 col-lg-offset-2'>
+                <div class='col-md-8 col-md-offset-1 col-lg-10 col-lg-offset-1'>
                     <div class='row'>
                         <div class='col-xs-12'>
                             <h2 class='col-xs-9'>{{t 'dashboard.title'}}</h2>
@@ -59,7 +59,7 @@
                                             <p class='text-center f-w-lg'>{{t 'dashboard.quicksearch.other_links' htmlSafe=true useSearch=this.useSearch}}</p>
                                             <div local-class='quick-search-table'>
                                                 <div class='row m-t-md' local-class='node-col-headers'>
-                                                    <div class='col-sm-3 col-md-3'>
+                                                    <div class='col-sm-2 col-md-2'>
                                                         <div local-class='quick-search-col'>
                                                             <span>{{t 'general.title'}}</span>
                                                             <SortButton
@@ -75,7 +75,7 @@
                                                             <span>{{t 'general.contributors'}}</span>
                                                         </div>
                                                     </div>
-                                                    <div class='col-sm-3 col-md-3'>
+                                                    <div class='col-sm-2 col-md-2'>
                                                         <div local-class='quick-search-col'>
                                                             <span>{{t 'general.modified'}}</span>
                                                             <SortButton
@@ -96,6 +96,11 @@
                                                             <span>{{t 'general.quota_notice'}}</span>
                                                         </div>
                                                     </div>
+                                                    <div class='col-sm-2 col-md-2'>
+                                                        <div local-class='quick-search-col'>
+                                                            <span>{{t 'general.groups'}}</span>
+                                                        </div>
+                                                    </div>
                                                 </div>
                                                 <div class='row'>
                                                     <div class='col-xs-12 f-w-xl text-right' local-class='node-sort-dropdown'>

app/models/node-mapcore-group.ts

@@ -0,0 +1,25 @@
+import { buildValidations } from 'ember-cp-validations';
+import DS from 'ember-data';
+import OsfModel, { Permission } from './osf-model';
+
+const { attr } = DS;
+
+const Validations = buildValidations({});
+export const permissions = Object.freeze(Object.values(Permission));
+
+export default class NodeMapcoreGroupModel extends OsfModel.extend(Validations) {
+    @attr('number') nodeGroupId!: number;
+    @attr('number') creatorId!: number;
+    @attr('fixstring') creator!: string;
+    @attr('fixstring') permission!: Permission;
+    @attr('number') mapcoreGroupId!: number;
+    @attr('fixstring') name!: string;
+    @attr('fixstring') created!: string;
+    @attr('fixstring') modified!: string;
+}
+
+declare module 'ember-data/types/registries/model' {
+    export default interface ModelRegistry {
+        'node-mapcore-group': NodeMapcoreGroupModel;
+    } // eslint-disable-line semi
+}

lib/handbook/addon/routes.js

@@ -50,6 +50,7 @@ export default buildRoutes(function() {
             this.route('schema-block-group-renderer');
             this.route('tags-widget');
             this.route('validated-model-form');
+            this.route('group-list');
         });
 
         this.route('helpers', function() {

lib/osf-components/addon/components/dashboard-item/template.hbs

@@ -5,7 +5,7 @@
     <div class='m-v-sm' local-class='DashboardItem'>
         <div class='row'>
             <div>
-                <div class='col-sm-3 col-md-3 p-v-xs'>
+                <div class='col-sm-2 col-md-2 p-v-xs'>
                     <div local-class='DashboardItem__col' class='di-title'>
                         <AncestryDisplay @node={{@node}} />
                         <strong data-test-dashboard-item-title>{{@node.title}}</strong>
@@ -16,7 +16,7 @@
                         <ContributorList @node={{this.node}} />
                     </div>
                 </div>
-                <div class='col-sm-3 col-md-3 p-v-xs'>
+                <div class='col-sm-2 col-md-2 p-v-xs'>
                     <div local-class='DashboardItem__col' class='di-date'>{{this.date}}</div>
                 </div>
                 <div class='col-sm-2 col-md-2 p-v-xs'>
@@ -25,6 +25,11 @@
                 <div class='col-sm-2 col-md-2 p-v-xs'>
                     <div local-class='DashboardItem__col' class='di-notice'>{{this.quotaNotice}}</div>
                 </div>
+                <div class='col-sm-2 col-md-2 p-v-xs'>
+                    <div local-class='DashboardItem__col' class='di-groups'>
+                        <GroupList @node={{this.node}} />
+                    </div>
+                </div>
             </div>
         </div>
     </div>

lib/osf-components/addon/components/group-list/component.ts

@@ -0,0 +1,75 @@
+import { tagName } from '@ember-decorators/component';
+import Component from '@ember/component';
+import { computed } from '@ember/object';
+import { alias } from '@ember/object/computed';
+import { inject as service } from '@ember/service';
+import { task } from 'ember-concurrency-decorators';
+import DS from 'ember-data';
+
+import { layout } from 'ember-osf-web/decorators/component';
+import Node from 'ember-osf-web/models/node';
+import NodeMapcoreGroup from 'ember-osf-web/models/node-mapcore-group';
+import Ready from 'ember-osf-web/services/ready';
+import captureException from 'ember-osf-web/utils/capture-exception';
+import defaultTo from 'ember-osf-web/utils/default-to';
+
+import styles from './styles';
+import template from './template';
+
+@layout(template, styles)
+@tagName('span')
+export default class GroupList extends Component {
+    // Required arguments
+    node?: Node;
+
+    // Optional arguments
+    shouldTruncate: boolean = defaultTo(this.shouldTruncate, true);
+
+    // Private properties
+    @service store!: DS.Store;
+    @service ready!: Ready;
+
+    displayedGroups: NodeMapcoreGroup[] = [];
+    totalGroups?: number;
+
+    @alias('loadGroups.isRunning')
+    isLoading!: boolean;
+
+    @task({ restartable: true, on: 'didReceiveAttrs' })
+    loadGroups = task(function *(this: GroupList) {
+        try {
+            if (!this.node || this.node.isAnonymous) {
+                return;
+            }
+            const blocker = this.ready.getBlocker();
+            const itemsFromResult = (res: any) => {
+                const arr = (res && typeof res.toArray === 'function') ? res.toArray() : res || [];
+                return arr.map((item: any) => {
+                    if (item && typeof item === 'object' && item.__data) {
+                        return item.__data;
+                    }
+                    return item;
+                });
+            };
+
+            const query = { nodeId: this.node.id, page: 1, visible: true };
+            const result = yield this.store.query('node-mapcore-group', query);
+            const groups = itemsFromResult(result) as NodeMapcoreGroup[];
+            const meta = (result as any).meta || {};
+            this.setProperties({
+                displayedGroups: groups,
+                totalGroups: meta.total || groups.length,
+            });
+
+            blocker.done();
+        } catch (e) {
+            captureException(e, { errorMessage: 'loadGroups task failed synchronously' });
+            throw e;
+        }
+    });
+
+    @computed('truncated')
+    get truncateCount() {
+        return this.shouldTruncate ? 3 : undefined;
+    }
+}

lib/osf-components/addon/components/group-list/group/component.ts

@@ -0,0 +1,28 @@
+import { tagName } from '@ember-decorators/component';
+import Component from '@ember/component';
+import { task } from 'ember-concurrency-decorators';
+
+import { layout } from 'ember-osf-web/decorators/component';
+import NodeMapcoreGroup from 'ember-osf-web/models/node-mapcore-group';
+import defaultTo from 'ember-osf-web/utils/default-to';
+import template from './template';
+
+@layout(template)
+@tagName('')
+export default class NodeMapcoreGroupListGroup extends Component {
+    group!: NodeMapcoreGroup;
+    shouldShortenName: boolean = defaultTo(this.shouldShortenName, false);
+
+    groupName?: string;
+
+    @task({ restartable: true, on: 'didReceiveAttrs' })
+    loadGroup = task(function *(this: NodeMapcoreGroupListGroup) {
+        yield Promise.resolve();
+        this.set(
+            'groupName',
+            this.shouldShortenName
+                ? this.group && this.group.name
+                : this.group.name,
+        );
+    });
+}

lib/osf-components/addon/components/group-list/group/template.hbs

@@ -0,0 +1,3 @@
+<span data-test-group-name={{@group.mapcoreGroupId}}>
+    {{~this.groupName~}}
+</span>

lib/osf-components/addon/components/group-list/styles.scss

@@ -0,0 +1,3 @@
+:global(.btn).load-groups {
+    padding: 0 0 3px;
+}

lib/osf-components/addon/components/group-list/template.hbs

@@ -0,0 +1,23 @@
+{{#if this.node.isAnonymous}}
+    {{t 'group_list.anonymous'}}
+{{else}}
+    <InlineList
+        @items={{this.displayedGroups}}
+        @total={{this.totalGroups}}
+        @truncate={{this.truncateCount}}
+        as |list|
+    >
+        {{~#if list.item}}
+            {{~group-list/group
+                group=list.item
+                shouldShortenName=this.shouldTruncate
+            ~}}
+        {{else if list.remainingCount}}
+            {{#if this.isLoading }}
+                <LoadingIndicator @inline={{true}} @dark={{true}} />
+            {{else}}
+                {{t 'group_list.x_more' x=list.remainingCount}}
+            {{/if}}
+        {{/if~}}
+    </InlineList>
+{{/if}}

lib/osf-components/addon/components/new-project-modal/component.ts

@@ -215,4 +215,20 @@ export default class NewProjectModal extends Component {
     searchNodes(this: NewProjectModal, searchTerm: string) {
         return this.get('searchUserNodesTask').perform(searchTerm);
     }
+
+    @action
+    handleKeydown(_: string, event: KeyboardEvent & { isComposing?: boolean }) {
+        if (!event) {
+            return;
+        }
+
+        const isIME = event.isComposing || event.keyCode === 229;
+        if (isIME) {
+            return;
+        }
+        if (event.key === 'Enter' && this.nodeTitle && this.nodeTitle.trim()) {
+            event.preventDefault();
+            this.create();
+        }
+    }
 }

lib/osf-components/addon/components/new-project-modal/template.hbs

@@ -41,7 +41,7 @@
                                 @required={{true}}
                                 @value={{this.nodeTitle}}
                                 @type='text'
-                                @enter={{action this.create}}
+                                @key-down={{action this.handleKeydown}}
                             />
                         </label>
                     </div>

lib/osf-components/app/components/group-list/component.js

@@ -0,0 +1 @@
+export { default } from 'osf-components/components/group-list/component';

lib/osf-components/app/components/group-list/group/component.js

@@ -0,0 +1 @@
+export { default } from 'osf-components/components/group-list/group/component';

mirage/config.ts

@@ -89,6 +89,15 @@ export default function(this: Server) {
         defaultSortKey: 'index',
         onCreate: createBibliographicContributor,
     });
+    // Added handler for node map_core groups so adapters querying
+    // Returns an empty paginated response by default.
+    this.get('/nodes/:parentID/map_core/groups', () => ({
+        data: [],
+        meta: {
+            total: 0,
+            per_page: 10,
+        },
+    }));
 
     this.get('/nodes/:parentID/files', nodeFileProviderList); // Node file providers list
     this.get('/nodes/:parentID/files/:fileProviderId', nodeFilesListForProvider); // Node files list for file provider