repo share admin (#5596)

* repo share admin * check share_to param * [repo 'share admin' dialog] removed 'internal links'; fixup & improvements --------- Co-authored-by: llj <lingjun.li1@gmail.com>
2025-09-10 19:29:56 +00:00 · 2023-08-24 10:18:40 +08:00
parent 191ab183f8
commit 3b6142e639
14 changed files with 1244 additions and 247 deletions
--- a/frontend/src/components/dialog/repo-share-admin-dialog.js
+++ b/frontend/src/components/dialog/repo-share-admin-dialog.js
@@ -0,0 +1,130 @@
+import React, { Fragment } from 'react';
+import PropTypes from 'prop-types';
+import { Modal, ModalHeader, ModalBody, TabContent, TabPane, Nav, NavItem, NavLink } from 'reactstrap';
+import { gettext, canGenerateShareLink, canGenerateUploadLink } from '../../utils/constants';
+import RepoShareAdminShareLinks from './repo-share-admin/share-links';
+import RepoShareAdminUploadLinks from './repo-share-admin/upload-links';
+import RepoShareAdminUserShares from './repo-share-admin/user-shares';
+import RepoShareAdminGroupShares from './repo-share-admin/group-shares';
+
+const propTypes = {
+  repo: PropTypes.object.isRequired,
+  toggleDialog: PropTypes.func.isRequired,
+};
+
+class RepoShareAdminDialog extends React.Component {
+
+  constructor(props) {
+    super(props);
+    this.enableShareLink = !this.props.repo.encrypted && canGenerateShareLink;
+    this.enableUploadLink = !this.props.repo.encrypted && canGenerateUploadLink;
+    this.state = {
+      activeTab: this.getInitialActiveTab()
+    };
+  }
+
+  getInitialActiveTab = () => {
+    if (this.enableShareLink) {
+      return 'shareLink';
+    } else if (this.enableUploadLink) {
+      return 'uploadLink';
+    } else {
+      return 'shareToUser';
+    }
+  }
+
+  toggle = (tab) => {
+    if (this.state.activeTab !== tab) {
+      this.setState({ activeTab: tab });
+    }
+  }
+
+  onTabKeyDown = (e) => {
+    if (e.key == 'Enter' || e.key == 'Space') {
+      e.target.click();
+    }
+  }
+
+  render() {
+    const { activeTab } = this.state;
+    const { repoName } = this.props.repo;
+
+    return (
+      <div>
+        <Modal isOpen={true} style={{maxWidth: '760px'}} className="share-dialog" toggle={this.props.toggleDialog}>
+          <ModalHeader toggle={this.props.toggleDialog}>
+            <span className="op-target" title={repoName}>{repoName}</span> {gettext('Share Admin')}
+          </ModalHeader>
+          <ModalBody className="dialog-list-container share-dialog-content" role="tablist">
+            <Fragment>
+              <div className="share-dialog-side">
+                <Nav pills>
+                  {this.enableShareLink &&
+                  <NavItem role="tab" aria-selected={activeTab === 'shareLink'} aria-controls="share-link-panel">
+                    <NavLink className={activeTab === 'shareLink' ? 'active' : ''} onClick={(this.toggle.bind(this, 'shareLink'))} tabIndex="0" onKeyDown={this.onTabKeyDown}>
+                      {gettext('Share Links')}
+                    </NavLink>
+                  </NavItem>
+                  }
+                  {this.enableUploadLink &&
+                    <NavItem role="tab" aria-selected={activeTab === 'uploadLink'} aria-controls="upload-link-panel">
+                      <NavLink className={activeTab === 'uploadLink' ? 'active' : ''} onClick={this.toggle.bind(this, 'uploadLink')} tabIndex="0" onKeyDown={this.onTabKeyDown}>
+                        {gettext('Upload Links')}
+                      </NavLink>
+                    </NavItem>
+                  }
+                  <NavItem role="tab" aria-selected={activeTab === 'shareToUser'} aria-controls="share-to-user-panel">
+                    <NavLink className={activeTab === 'shareToUser' ? 'active' : ''} onClick={this.toggle.bind(this, 'shareToUser')} tabIndex="0" onKeyDown={this.onTabKeyDown}>
+                      {gettext('User Shares')}
+                    </NavLink>
+                  </NavItem>
+                  <NavItem role="tab" aria-selected={activeTab === 'shareToGroup'} aria-controls="share-to-group-panel">
+                    <NavLink className={activeTab === 'shareToGroup' ? 'active' : ''} onClick={this.toggle.bind(this, 'shareToGroup')} tabIndex="0" onKeyDown={this.onTabKeyDown}>
+                      {gettext('Group Shares')}
+                    </NavLink>
+                  </NavItem>
+                </Nav>
+              </div>
+              <div className="share-dialog-main">
+                <TabContent activeTab={this.state.activeTab}>
+                  {(this.enableShareLink && activeTab === 'shareLink') &&
+                    <TabPane tabId="shareLink" role="tabpanel" id="share-link-panel">
+                      <RepoShareAdminShareLinks
+                        repo={this.props.repo}
+                      />
+                    </TabPane>
+                  }
+                  {(this.enableUploadLink && activeTab === 'uploadLink') &&
+                    <TabPane tabId="uploadLink" role="tabpanel" id="upload-link-panel">
+                      <RepoShareAdminUploadLinks
+                        repo={this.props.repo}
+                      />
+                    </TabPane>
+                  }
+                  {activeTab === 'shareToUser' &&
+                    <TabPane tabId="shareToUser" role="tabpanel" id="share-to-user-panel">
+                      <RepoShareAdminUserShares
+                        repo={this.props.repo}
+                      />
+                    </TabPane>
+                  }
+                  {activeTab === 'shareToGroup' &&
+                    <TabPane tabId="shareToGroup" role="tabpanel" id="share-to-group-panel">
+                      <RepoShareAdminGroupShares
+                        repo={this.props.repo}
+                      />
+                    </TabPane>
+                  }
+                </TabContent>
+              </div>
+            </Fragment>
+          </ModalBody>
+        </Modal>
+      </div>
+    );
+  }
+}
+
+RepoShareAdminDialog.propTypes = propTypes;
+
+export default RepoShareAdminDialog;