WIP: Implement rest fetch list.

packages/webapp/src/classes/client/rest-client/index.ts

@@ -20,7 +20,30 @@ export default class RestClient implements Client {
     }
 
     fetchMapPermissions(id: number): Promise<Permission[]> {
-        throw new Error('Method not implemented.' + id);
+        const handler = (success: (labels: Permission[]) => void, reject: (error: ErrorInfo) => void) => {
+            axios.get(
+                this.baseUrl + `/c/restful/maps/${id}/collabs`,
+                {
+                    headers: { 'Content-Type': 'text/plain' }
+                }
+            ).then(response => {
+                const data = response.data;
+                // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                const perms: Permission[] = (data.collaborations as any[]).map(p => {
+                    return {
+                        id: p.id,
+                        email: p.email,
+                        name: p.name,
+                        role: p.role
+                    }
+                })
+                success(perms);
+            }).catch(error => {
+                const errorInfo = this.parseResponseOnError(error.response);
+                reject(errorInfo);
+            });
+        }
+        return new Promise(handler);
     }
 
     deleteAccount(): Promise<void> {

packages/webapp/src/components/maps-page/action-dispatcher/share-dialog/index.tsx

@@ -100,6 +100,10 @@ const ShareDialog = ({ mapId, onClose }: SimpleDialogProps): React.ReactElement
     return client.fetchMapPermissions(mapId);
   });
 
+  const formatName = (perm: Permission): string => {
+    return perm.name ? `${perm.name}<${perm.email}>` : perm.email;
+  }
+
   return (
     <div>
       <BaseDialog
@@ -175,7 +179,7 @@ const ShareDialog = ({ mapId, onClose }: SimpleDialogProps): React.ReactElement
               {permissions && permissions.map((permission) => {
                 return (
                   <ListItem key={permission.email} role={undefined} dense button>
-                    <ListItemText id={permission.email} primary={`${permission.name}<${permission.email}>`} />
+                    <ListItemText id={permission.email} primary={formatName(permission)} />
 
                     <RoleIcon role={permission.role} />
                     < ListItemSecondaryAction >