Merge pull request #3782 from haiwen/7.0-upload-links-expire-days

add expire days to upload link

frontend/src/components/dialog/generate-upload-link.js

@@ -1,6 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import copy from 'copy-to-clipboard';
+import moment from 'moment';
 import { Button, Form, FormGroup, Label, Input, InputGroup, InputGroupAddon, Alert } from 'reactstrap';
 import { gettext, shareLinkPasswordMinLength, canSendShareLinkEmail } from '../../utils/constants';
 import { seafileAPI } from '../../utils/seafile-api';
@@ -25,7 +26,9 @@ class GenerateUploadLink extends React.Component {
       password: '',
       passwdnew: '',
       sharedUploadInfo: null,
-      isSendLinkShown: false
+      isSendLinkShown: false,
+      isExpireChecked: false,
+      expireDays: 0,
     };
   }
 
@@ -90,29 +93,61 @@ class GenerateUploadLink extends React.Component {
   generateUploadLink = () => {
     let path = this.props.itemPath;
     let repoID = this.props.repoID; 
+    let { password, expireDays } = this.state;
 
-    if (this.state.showPasswordInput && (this.state.password == '')) {
-      this.setState({
-        errorInfo: gettext('Please enter password')
-      });
-    }
-    else if (this.state.showPasswordInput && (this.state.showPasswordInput && this.state.password.length < shareLinkPasswordMinLength)) {
-      this.setState({
-        errorInfo: gettext('Password is too short')
-      });
-    }
-    else if (this.state.showPasswordInput && (this.state.password !== this.state.passwordnew)) {
-      this.setState({
-        errorInfo: gettext('Passwords don\'t match')
-      });
-    } else {
-      seafileAPI.createUploadLink(repoID, path, this.state.password).then((res) => {
+    let isValid = this.validateParamsInput();
+    if (isValid) {
+      seafileAPI.createUploadLink(repoID, path, password, expireDays).then((res) => {
         let sharedUploadInfo = new SharedUploadInfo(res.data);
         this.setState({sharedUploadInfo: sharedUploadInfo}); 
       });
     }
   }
 
+  validateParamsInput = () => {
+    let { showPasswordInput , password, passwordnew, isExpireChecked, expireDays } = this.state;
+
+    // check password params
+    if (showPasswordInput) {
+      if (password.length === 0) {
+        this.setState({errorInfo: gettext('Please enter password')});
+        return false;
+      }
+      if (password.length < shareLinkPasswordMinLength) {
+        this.setState({errorInfo: gettext('Password is too short')});
+        return false;
+      }
+      if (password !== passwordnew) {
+        this.setState({errorInfo: gettext('Passwords don\'t match')});
+        return false;
+      }
+    }
+
+    // check expire day params
+    let reg = /^\d+$/;
+    if (isExpireChecked) {
+      if (!expireDays) {
+        this.setState({errorInfo: gettext('Please enter days')});
+        return false;
+      }
+      if (!reg.test(expireDays)) {
+        this.setState({errorInfo: gettext('Please enter a non-negative integer')});
+        return false;
+      }
+      this.setState({expireDays: parseInt(expireDays)});
+    }
+    return true;
+  }
+
+  onExpireChecked = (e) => {
+    this.setState({isExpireChecked: e.target.checked});
+  }
+
+  onExpireDaysChanged = (e) => {
+    let day = e.target.value.trim();
+    this.setState({expireDays: day});
+  }
+
   onCopyUploadLink = () => {
     let uploadLink = this.state.sharedUploadInfo.link;
     copy(uploadLink);
@@ -156,6 +191,12 @@ class GenerateUploadLink extends React.Component {
                 <span className="far fa-copy action-icon" onClick={this.onCopyUploadLink}></span>
               </dd>
             </FormGroup>
+            {sharedUploadInfo.expire_date && (
+              <FormGroup className="mb-0">
+                <dt className="text-secondary font-weight-normal">{gettext('Expiration Date:')}</dt>
+                <dd>{moment(sharedUploadInfo.expire_date).format('YYYY-MM-DD hh:mm:ss')}</dd>
+              </FormGroup>
+            )}
           </Form>
           {canSendShareLinkEmail && !isSendLinkShown && <Button onClick={this.toggleSendLink} className="mr-2">{gettext('Send')}</Button>}
           {!isSendLinkShown && <Button onClick={this.deleteUploadLink}>{gettext('Delete')}</Button>}
@@ -192,6 +233,18 @@ class GenerateUploadLink extends React.Component {
             <Input className="passwd" type={this.state.passwordVisible ? 'text' : 'password'} value={this.state.passwordnew || ''} onChange={this.inputPasswordNew} />
           </FormGroup>
         }
+        <FormGroup check>
+          <Label check>
+            <Input className="expire-checkbox" type="checkbox" onChange={this.onExpireChecked}/>{'  '}{gettext('Add auto expiration')}
+          </Label>
+        </FormGroup>
+        {this.state.isExpireChecked &&
+          <FormGroup check>
+            <Label check>
+              <Input className="expire-input expire-input-border" type="text" value={this.state.expireDays} onChange={this.onExpireDaysChanged} readOnly={!this.state.isExpireChecked}/><span className="expir-span">{gettext('days')}</span>
+            </Label>
+          </FormGroup>
+        }
         {this.state.errorInfo && <Alert color="danger" className="mt-2">{this.state.errorInfo}</Alert>}
         <Button className="generate-link-btn" onClick={this.generateUploadLink}>{gettext('Generate')}</Button>
       </Form>

frontend/src/models/shared-upload-info.js

@@ -10,6 +10,8 @@ class SharedUploadInfo {
     this.ctime = object.ctime;
     this.token = object.token;
     this.view_cnt = object.view_cnt;
+    this.expire_date = object.expire_date;
+    this.is_expired = object.is_expired;
   }
 
 }

frontend/src/pages/share-admin/upload-links.js

@@ -1,5 +1,6 @@
-import React, { Component } from 'react';
+import React, { Component, Fragment } from 'react';
 import { Link } from '@reach/router';
+import moment from 'moment';
 import { Modal, ModalHeader, ModalBody } from 'reactstrap';
 import { gettext, siteRoot, loginUrl, canGenerateShareLink } from '../../utils/constants';
 import { seafileAPI } from '../../utils/seafile-api';
@@ -52,9 +53,10 @@ class Content extends Component {
             <thead>
               <tr>
                 <th width="4%">{/*icon*/}</th>
-                <th width="42%">{gettext('Name')}</th>
-                <th width="30%">{gettext('Library')}</th>
-                <th width="14%">{gettext('Visits')}</th>
+                <th width="30%">{gettext('Name')}</th>
+                <th width="24%">{gettext('Library')}</th>
+                <th width="16%">{gettext('Visits')}</th>
+                <th width="16%">{gettext('Expiration')}</th>
                 <th width="10%">{/*Operations*/}</th>
               </tr>
             </thead>
@@ -114,6 +116,24 @@ class Item extends Component {
     return { iconUrl, uploadUrl };
   }
 
+  renderExpriedData = () => {
+    let item = this.props.item;
+    if (!item.expire_date) {
+      return (
+        <Fragment>--</Fragment>
+      );
+    }
+    let expire_date = moment(item.expire_date).format('YYYY-MM-DD');
+    return (
+      <Fragment>
+        {item.is_expired ?
+          <span className="error">{expire_date}</span> :
+          expire_date
+        }
+      </Fragment>
+    );
+  }
+
   render() {
     let item = this.props.item;
     let { iconUrl, uploadUrl } = this.getUploadParams();
@@ -128,6 +148,7 @@ class Item extends Component {
         <td><Link to={uploadUrl}>{item.obj_name}</Link></td>
         <td><Link to={`${siteRoot}library/${item.repo_id}/${item.repo_name}`}>{item.repo_name}</Link></td>
         <td>{item.view_cnt}</td>
+        <td>{this.renderExpriedData()}</td>
         <td>
           <a href="#" className={linkIconClassName} title={gettext('View')} onClick={this.viewLink}></a>
           <a href="#" className={deleteIconClassName} title={gettext('Remove')} onClick={this.removeLink}></a>