Implemented rendering user list as <ul>

scm-ui/src/groups/components/table/Details.js

@@ -10,10 +10,7 @@ type Props = {
 };
 
 class Details extends React.Component<Props> {
-
-  
-  render() {  console.log(new Date('2011-04-11T10:20:30Z').toString());
-
+  render() {
     const { group, t } = this.props;
     return (
       <table className="table">
@@ -30,33 +27,30 @@ class Details extends React.Component<Props> {
             <td>{t("group.type")}</td>
             <td>{group.type}</td>
           </tr>
-          {this.renderMembers()}
+          <tr>
+            <td>{this.renderMembers()}</td>
+          </tr>
         </tbody>
       </table>
     );
-
-
   }
 
   renderMembers() {
     if (this.props.group.members.length > 0) {
       return (
-      <tr>
-          <td>{this.props.t("group.members")}</td>
-          <td>
-            <table><tbody>
+        <div>
+          {this.props.t("group.members")}
+          <ul>
             {this.props.group._embedded.members.map((member, index) => {
-            return <GroupMember key={index} member={member} />;
+              return <GroupMember key={index} member={member} />;
             })}
-            </tbody></table>
-          </td>
-      </tr>
+          </ul>
+        </div>
       );
     } else {
       return;
     }
   }
-
 }
 
 export default translate("groups")(Details);

scm-ui/src/groups/components/table/GroupMember.js

@@ -1,7 +1,7 @@
 // @flow
 import React from "react";
 import { Link } from "react-router-dom";
-import type {User} from "../../../users/types/User";
+import type { User } from "../../../users/types/User";
 
 type Props = {
   member: User
@@ -12,25 +12,17 @@ export default class GroupMember extends React.Component<Props> {
     return <Link to={to}>{label}</Link>;
   }
 
-  showName(to: any, member:User) {
-    if(member._links.self){
-      return  this.renderLink(to, member.name);
-    }
-    else {
-      return member.name
+  showName(to: any, member: User) {
+    if (member._links.self) {
+      return this.renderLink(to, member.name);
+    } else {
+      return member.name;
     }
   }
 
   render() {
     const { member } = this.props;
     const to = `/user/${member.name}`;
-    return (
-      <tr className="is-hidden-mobile">
-        <td>
-          {this.showName(to, member)}
-        </td>
-      </tr>
-
-    );
+    return <li>{this.showName(to, member)}</li>;
   }
 }