From c5c3a08aa97a08383948ebb3e5a11dc9e87c9529 Mon Sep 17 00:00:00 2001
From: Yixiang Zhao <seriouszyx@foxmail.com>
Date: Wed, 11 May 2022 20:23:36 +0800
Subject: [PATCH] feat: add saml metadata in application edit page (#750)

* feat: add saml metadata in application edit page

Signed-off-by: Yixiang Zhao <seriouszyx@foxmail.com>

* Update ApplicationEditPage.js

Co-authored-by: Yang Luo <hsluoyz@qq.com>
---
 web/src/ApplicationEditPage.js        | 20 ++++++++++++++++++++
 web/src/backend/ApplicationBackend.js |  7 +++++++
 2 files changed, 27 insertions(+)

diff --git a/web/src/ApplicationEditPage.js b/web/src/ApplicationEditPage.js
index 65b4ae82..ba8e8483 100644
--- a/web/src/ApplicationEditPage.js
+++ b/web/src/ApplicationEditPage.js
@@ -35,6 +35,7 @@ require('codemirror/theme/material-darker.css');
 require("codemirror/mode/htmlmixed/htmlmixed");
 
 const { Option } = Select;
+const { TextArea } = Input;
 
 class ApplicationEditPage extends React.Component {
   constructor(props) {
@@ -48,6 +49,7 @@ class ApplicationEditPage extends React.Component {
       providers: [],
       uploading: false,
       mode: props.location.mode !== undefined ? props.location.mode : "edit",
+      samlMetadata: null,
     };
   }
 
@@ -56,6 +58,7 @@ class ApplicationEditPage extends React.Component {
     this.getOrganizations();
     this.getCerts();
     this.getProviders();
+    this.getSamlMetadata();
   }
 
   getApplication() {
@@ -97,6 +100,15 @@ class ApplicationEditPage extends React.Component {
       });
   }
 
+  getSamlMetadata() {
+    ApplicationBackend.getSamlMetadata("admin", this.state.applicationName)
+      .then((res) => {
+        this.setState({
+          samlMetadata: res,
+        })
+      });
+  }
+
   parseApplicationField(key, value) {
     if (["expireInHours", "refreshExpireInHours"].includes(key)) {
       value = Setting.myParseInt(value);
@@ -461,6 +473,14 @@ class ApplicationEditPage extends React.Component {
             </Select>
           </Col>
         </Row>
+        <Row style={{marginTop: '20px'}} >
+          <Col style={{marginTop: '5px'}} span={(Setting.isMobile()) ? 22 : 2}>
+            {Setting.getLabel(i18next.t("application:SAML metadata"), i18next.t("application:SAML metadata - Tooltip"))} :
+          </Col>
+          <Col span={22}>
+            <TextArea rows={8} value={this.state.samlMetadata} />
+          </Col>
+        </Row>
         <Row style={{marginTop: '20px'}} >
           <Col style={{marginTop: '5px'}} span={(Setting.isMobile()) ? 22 : 2}>
             {Setting.getLabel(i18next.t("general:Providers"), i18next.t("general:Providers - Tooltip"))} :
diff --git a/web/src/backend/ApplicationBackend.js b/web/src/backend/ApplicationBackend.js
index ee04e4d3..d8e9a827 100644
--- a/web/src/backend/ApplicationBackend.js
+++ b/web/src/backend/ApplicationBackend.js
@@ -69,3 +69,10 @@ export function deleteApplication(application) {
     body: JSON.stringify(newApplication),
   }).then(res => res.json());
 }
+
+export function getSamlMetadata(owner, name) {
+  return fetch(`${Setting.ServerUrl}/api/saml/metadata?application=${owner}/${encodeURIComponent(name)}`, {
+    method: "GET",
+    credentials: "include"
+  }).then(res => res.text());
+}