Add RedirectUrls to app.

object/application.go

@@ -33,6 +33,7 @@ type Application struct {
 
 	ClientId     string   `xorm:"varchar(100)" json:"clientId"`
 	ClientSecret string   `xorm:"varchar(100)" json:"clientSecret"`
+	RedirectUrls []string `xorm:"varchar(1000)" json:"redirectUrls"`
 }
 
 func GetApplications(owner string) []*Application {

web/src/ApplicationEditPage.js

@@ -21,6 +21,7 @@ import * as ProviderBackend from "./backend/ProviderBackend";
 import * as OrganizationBackend from "./backend/OrganizationBackend";
 import Face from "./auth/Face";
 import i18next from "i18next";
+import UrlTable from "./UrlTable";
 
 const { Option } = Select;
 
@@ -173,6 +174,18 @@ class ApplicationEditPage extends React.Component {
             }} />
           </Col>
         </Row>
+        <Row style={{marginTop: '20px'}} >
+          <Col style={{marginTop: '5px'}} span={2}>
+            {i18next.t("application:Redirect URLs")}:
+          </Col>
+          <Col span={22} >
+            <UrlTable
+              title="Redirect URLs"
+              table={this.state.application.redirectUrls}
+              onUpdateTable={(value) => { this.updateApplicationField('redirectUrls', value)}}
+            />
+          </Col>
+        </Row>
         <Row style={{marginTop: '20px'}} >
           <Col style={{marginTop: '5px'}} span={2}>
             {i18next.t("application:Enable Password")}:

web/src/ApplicationListPage.js

@@ -51,6 +51,7 @@ class ApplicationListPage extends React.Component {
       logo: "https://cdn.casbin.com/logo/logo_384x96.png",
       EnablePassword: true,
       providers: [],
+      redirectUrls: [],
     }
   }
 

web/src/UrlTable.js

@@ -0,0 +1,124 @@
+// Copyright 2021 The casbin Authors. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+import React from "react";
+import {DownOutlined, DeleteOutlined, UpOutlined} from '@ant-design/icons';
+import {Button, Col, Input, Row, Table, Tooltip} from 'antd';
+import * as Setting from "./Setting";
+
+class UrlTable extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      classes: props,
+    };
+  }
+
+  updateTable(table) {
+    this.props.onUpdateTable(table);
+  }
+
+  updateField(table, index, value) {
+    table[index] = value;
+    this.updateTable(table);
+  }
+
+  addRow(table) {
+    let row = "";
+    if (table === undefined) {
+      table = [];
+    }
+    table = Setting.addRow(table, row);
+    this.updateTable(table);
+  }
+
+  deleteRow(table, i) {
+    table = Setting.deleteRow(table, i);
+    this.updateTable(table);
+  }
+
+  upRow(table, i) {
+    table = Setting.swapRow(table, i - 1, i);
+    this.updateTable(table);
+  }
+
+  downRow(table, i) {
+    table = Setting.swapRow(table, i, i + 1);
+    this.updateTable(table);
+  }
+
+  renderTable(table) {
+    const columns = [
+      {
+        title: 'Redirect URLs',
+        dataIndex: 'id',
+        key: 'id',
+        render: (text, record, index) => {
+          return (
+            <Input value={text} onChange={e => {
+              this.updateField(table, index, e.target.value);
+            }} />
+          )
+        }
+      },
+      {
+        title: 'Action',
+        key: 'action',
+        width: '120px',
+        render: (text, record, index) => {
+          return (
+            <div>
+              <Tooltip placement="bottomLeft" title="Up">
+                <Button style={{marginRight: "5px"}} disabled={index === 0} icon={<UpOutlined />} size="small" onClick={() => this.upRow(table, index)} />
+              </Tooltip>
+              <Tooltip placement="topLeft" title="Down">
+                <Button style={{marginRight: "5px"}} disabled={index === table.length - 1} icon={<DownOutlined />} size="small" onClick={() => this.downRow(table, index)} />
+              </Tooltip>
+              <Tooltip placement="topLeft" title="Delete">
+                <Button icon={<DeleteOutlined />} size="small" onClick={() => this.deleteRow(table, index)} />
+              </Tooltip>
+            </div>
+          );
+        }
+      },
+    ];
+
+    return (
+      <Table columns={columns} dataSource={table.map(row => ({id: row}))} size="middle" bordered pagination={{pageSize: 100}}
+             title={() => (
+               <div>
+                 {this.props.title}&nbsp;&nbsp;&nbsp;&nbsp;
+                 <Button style={{marginRight: "5px"}} type="primary" size="small" onClick={() => this.addRow(table)}>Add</Button>
+               </div>
+             )}
+      />
+    );
+  }
+
+  render() {
+    return (
+      <div>
+        <Row style={{marginTop: '20px'}} >
+          <Col span={24}>
+            {
+              this.renderTable(this.props.table)
+            }
+          </Col>
+        </Row>
+      </div>
+    )
+  }
+}
+
+export default UrlTable;