added 'empty tip' for 'groups', linked devices', and 'favourites' pages

frontend/src/pages/groups/groups-view.js

@@ -1,6 +1,6 @@
 import React, { Fragment } from 'react';
 import PropTypes from 'prop-types';
-import { gettext, siteRoot, loginUrl } from '../../utils/constants';
+import { gettext, siteRoot, loginUrl, canAddGroup } from '../../utils/constants';
 import { seafileAPI } from '../../utils/seafile-api';
 import Loading from '../../components/loading';
 import Group from '../../models/group';
@@ -10,6 +10,7 @@ import GroupsToolbar from '../../components/toolbar/groups-toolbar';
 import SharedRepoListView from '../../components/shared-repo-list-view/shared-repo-list-view';
 import CreateGroupDialog from '../../components/dialog/create-group-dialog';
 import LibDetail from '../../components/dirent-detail/lib-details';
+import EmptyTip from '../../components/empty-tip';
 
 import '../../css/groups.css';
 
@@ -55,11 +56,11 @@ class RepoListViewPanel extends React.Component {
       });
       this.setState({repoList: repoList});
       let name = repo.repo_name;
-      var msg = gettext("Successfully deleted {name}.").replace('{name}', name);
+      var msg = gettext('Successfully deleted {name}.').replace('{name}', name);
       toaster.success(msg);
     }).catch(() => {
       let name = repo.repo_name;
-      var msg = gettext("Failed to delete {name}.").replace('{name}', name);
+      var msg = gettext('Failed to delete {name}.').replace('{name}', name);
       toaster.danger(msg);
     });
   }
@@ -187,6 +188,16 @@ class GroupsView extends React.Component {
   }
 
   render() {
+    const emptyTip = (
+      <EmptyTip>
+        <h2>{gettext('You are not in any groups')}</h2>
+        {canAddGroup ?
+          <p>{gettext('Groups allow multiple people to collaborate on libraries. You can create a group by clicking the "New Group" button.')}</p> :
+          <p>{gettext('Groups allow multiple people to collaborate on libraries. Groups you join will be listed here.')}</p>
+        }
+      </EmptyTip>
+    );
+
     return (
       <Fragment>
         <GroupsToolbar
@@ -201,8 +212,8 @@ class GroupsView extends React.Component {
             </div>
             <div className="cur-view-content cur-view-content-groups">
               {this.state.isLoading && <Loading />}
-              {(!this.state.isLoading && this.state.errorMsg !== '') && this.state.errorMsg}
-              {/* {(!this.state.isLoading && this.state.groupList.length === 0 ) && emptyTip} //todo */}
+              {(!this.state.isLoading && this.state.errorMsg) && this.state.errorMsg}
+              {(!this.state.isLoading && !this.state.errorMsg && this.state.groupList.length == 0) && emptyTip}
               {!this.state.isLoading && this.state.groupList.map((group, index) => {
                 return (
                   <RepoListViewPanel 

frontend/src/pages/linked-devices/linked-devices.js

@@ -3,6 +3,7 @@ import moment from 'moment';
 import { seafileAPI } from '../../utils/seafile-api';
 import { gettext, loginUrl } from '../../utils/constants';
 import toaster from '../../components/toast';
+import EmptyTip from '../../components/empty-tip';
 
 class Content extends Component {
 
@@ -14,6 +15,13 @@ class Content extends Component {
     } else if (errorMsg) {
       return <p className="error text-center">{errorMsg}</p>;
     } else {
+      const emptyTip = (
+        <EmptyTip>
+          <h2>{gettext("You do not have connected devices")}</h2>
+          <p>{gettext("Your clients (Desktop/Android/iOS) will be listed here.")}</p>
+        </EmptyTip>
+      );
+
       const desktopThead = (
         <thead>
           <tr>
@@ -35,12 +43,12 @@ class Content extends Component {
         </thead>
       );
 
-      return (
+      return items.length ? (
         <table>
           {window.innerWidth >= 768 ? desktopThead : mobileThead}
           <TableBody items={items} />
         </table>
-      );
+      ): emptyTip;
     }
   }
 }

frontend/src/pages/starred/starred.js

@@ -4,6 +4,7 @@ import moment from 'moment';
 import { seafileAPI } from '../../utils/seafile-api';
 import { Utils } from '../../utils/utils';
 import { gettext, siteRoot, loginUrl } from '../../utils/constants';
+import EmptyTip from '../../components/empty-tip';
 
 class Content extends Component {
 
@@ -15,6 +16,12 @@ class Content extends Component {
     } else if (errorMsg) {
       return <p className="error text-center">{errorMsg}</p>;
     } else {
+      const emptyTip = (
+        <EmptyTip>
+          <h2>{gettext('You don\'t have any favorite items yet')}</h2>
+        </EmptyTip>
+      );
+
       const desktopThead = (
         <thead>
           <tr>
@@ -36,12 +43,12 @@ class Content extends Component {
         </thead>
       );
 
-      return ( 
+      return items.length ? (
         <table className="table-hover">
           {window.innerWidth >= 768 ? desktopThead : mobileThead}
           <TableBody items={items} />
         </table>
-      ); 
+      ) : emptyTip;
     }
   }
 }

frontend/src/utils/constants.js

@@ -23,6 +23,7 @@ export const name = window.app.pageOptions.name;
 export const contactEmail = window.app.pageOptions.contactEmail;
 export const username = window.app.pageOptions.username;
 export const canAddRepo = window.app.pageOptions.canAddRepo;
+export const canAddGroup = window.app.pageOptions.canAddGroup;
 export const canGenerateShareLink = window.app.pageOptions.canGenerateShareLink;
 export const canGenerateUploadLink = window.app.pageOptions.canGenerateUploadLink ? true : false;
 export const canViewOrg = window.app.pageOptions.canViewOrg === 'True';

seahub/templates/base_for_react.html

@@ -51,6 +51,7 @@
             contactEmail: "{{request.user.username|email2contact_email|escapejs}}",
             username: "{{request.user.username|escapejs}}",
             canAddRepo: {% if user.permissions.can_add_repo %} true {% else %} false {% endif %},
+            canAddGroup: {% if user.permissions.can_add_group %} true {% else %} false {% endif %},
             canGenerateShareLink: {% if user.permissions.can_generate_share_link %} true {% else %} false {% endif %},
             canGenerateUploadLink: {% if user.permissions.can_generate_upload_link %} true {% else %} false {% endif %},
             canViewOrg:'{{ user.permissions.can_view_org }}',

seahub/views/__init__.py

@@ -1268,7 +1268,3 @@ def react_fake_view(request, **kwargs):
         'folder_perm_enabled': folder_perm_enabled,
         'file_audit_enabled' : FILE_AUDIT_ENABLED
     })
-
-@login_required
-def react_group(request, group_id):
-    return render(request, "react_app.html")