Add apps to homepage.

authz/authz.go

@@ -82,6 +82,7 @@ p, *, *, GET, /api/get-account, *, *
 p, *, *, GET, /api/userinfo, *, *
 p, *, *, *, /api/login/oauth, *, *
 p, *, *, GET, /api/get-application, *, *
+p, *, *, GET, /api/get-applications, *, *
 p, *, *, GET, /api/get-user, *, *
 p, *, *, GET, /api/get-user-application, *, *
 p, *, *, GET, /api/get-resources, *, *

web/src/Setting.js

@@ -277,6 +277,11 @@ export function goToLink(link) {
 }
 
 export function goToLinkSoft(ths, link) {
+  if (link.startsWith("http")) {
+    openLink(link);
+    return;
+  }
+
   ths.props.history.push(link);
 }
 

web/src/basic/HomePage.js

@@ -14,6 +14,7 @@
 
 import React from "react";
 import {Card, Col, Row} from "antd";
+import * as ApplicationBackend from "../backend/ApplicationBackend";
 import * as Setting from "../Setting";
 import SingleCard from "./SingleCard";
 import i18next from "i18next";
@@ -23,9 +24,23 @@ class HomePage extends React.Component {
     super(props);
     this.state = {
       classes: props,
+      applications: null,
     };
   }
 
+  UNSAFE_componentWillMount() {
+    this.getApplicationsByOrganization(this.props.account.owner);
+  }
+
+  getApplicationsByOrganization(organizationName) {
+    ApplicationBackend.getApplicationsByOrganization("admin", organizationName)
+      .then((res) => {
+        this.setState({
+          applications: (res.msg === undefined) ? res : [],
+        });
+      });
+  }
+
   getItems() {
     let items = [];
     if (Setting.isAdminUser(this.props.account)) {
@@ -35,25 +50,32 @@ class HomePage extends React.Component {
         {link: "/providers", name: i18next.t("general:Providers"), organizer: i18next.t("general:OAuth providers")},
         {link: "/applications", name: i18next.t("general:Applications"), organizer: i18next.t("general:Applications that require authentication")},
       ];
-    } else {
-      items = [
-        {link: "/account", name: i18next.t("account:My Account"), organizer: i18next.t("account:Settings for your account")},
-      ];
-    }
 
-    for (let i = 0; i < items.length; i ++) {
+      for (let i = 0; i < items.length; i ++) {
-      let filename = items[i].link;
+        let filename = items[i].link;
-      if (filename === "/account") {
+        if (filename === "/account") {
-        filename = "/users";
+          filename = "/users";
+        }
+        items[i].logo = `https://cdn.casbin.com/static/img${filename}.png`;
+        items[i].createdTime = "";
       }
-      items[i].logo = `https://cdn.casbin.com/static/img${filename}.png`;
+    } else {
-      items[i].createdTime = "";
+      this.state.applications.forEach(application => {
+        console.log(application)
+        items.push({
+          link: application.homepageUrl, name: application.displayName, organizer: application.description, logo: application.logo, createdTime: "",
+        });
+      });
     }
 
     return items
   }
 
   renderCards() {
+    if (this.state.applications === null) {
+      return null;
+    }
+
     const items = this.getItems();
 
     if (Setting.isMobile()) {

web/src/basic/SingleCard.js

@@ -51,10 +51,10 @@ class SingleCard extends React.Component {
         <Card
           hoverable
           cover={
-            <img alt="logo" src={logo} width={"100%"} height={"100%"} />
+            <img alt="logo" src={logo} style={{width: "100%", height: "210px", objectFit: "scale-down"}} />
           }
           onClick={() => Setting.goToLinkSoft(this, link)}
-          style={isSingle ? {width: "320px"} : null}
+          style={isSingle ? {width: "320px"} : {width: "100%"}}
         >
           <Meta title={title} description={desc} />
           <br/>