From ef6259da58351f6d167288740da3cdac9faea915 Mon Sep 17 00:00:00 2001
From: Florian Scholdei <florian.scholdei@cloudogu.com>
Date: Wed, 20 Feb 2019 11:16:59 +0100
Subject: [PATCH] added pageactions for every page component

---
 .../packages/ui-components/src/layout/Page.js | 32 +++++++++++++++++--
 .../ui-components/src/layout/PageActions.js   | 28 ++++++++++++++++
 .../ui-components/src/layout/index.js         |  1 +
 3 files changed, 58 insertions(+), 3 deletions(-)
 create mode 100644 scm-ui-components/packages/ui-components/src/layout/PageActions.js

diff --git a/scm-ui-components/packages/ui-components/src/layout/Page.js b/scm-ui-components/packages/ui-components/src/layout/Page.js
index f0f2d5d971..6e25a86ac8 100644
--- a/scm-ui-components/packages/ui-components/src/layout/Page.js
+++ b/scm-ui-components/packages/ui-components/src/layout/Page.js
@@ -20,8 +20,15 @@ class Page extends React.Component<Props> {
     return (
       <section className="section">
         <div className="container">
-          <Title title={title} />
-          <Subtitle subtitle={subtitle} />
+          <div className="columns">
+            <div className="column">
+              <Title title={title} />
+              <Subtitle subtitle={subtitle} />
+            </div>
+            <div className="column is-two-fifths is-pulled-right">
+              {this.renderPageActions()}
+            </div>
+          </div>
           <ErrorNotification error={error} />
           {this.renderContent()}
         </div>
@@ -37,7 +44,26 @@ class Page extends React.Component<Props> {
     if (loading) {
       return <Loading />;
     }
-    return children;
+
+    let content = [];
+    React.Children.forEach(children, child => {
+      if (child.type.name !== "PageActions") {
+        content.push(child);
+      }
+    });
+    return content;
+  }
+
+  renderPageActions() {
+    const { children } = this.props;
+
+    let content = null;
+    React.Children.forEach(children, child => {
+      if (child.type.name === "PageActions") {
+        content = child;
+      }
+    });
+    return content;
   }
 }
 
diff --git a/scm-ui-components/packages/ui-components/src/layout/PageActions.js b/scm-ui-components/packages/ui-components/src/layout/PageActions.js
new file mode 100644
index 0000000000..eb055a5605
--- /dev/null
+++ b/scm-ui-components/packages/ui-components/src/layout/PageActions.js
@@ -0,0 +1,28 @@
+//@flow
+import * as React from "react";
+import Loading from "./../Loading";
+
+type Props = {
+  loading?: boolean,
+  error?: Error,
+  children: React.Node
+};
+
+class PageActions extends React.Component<Props> {
+  render() {
+    return <>{this.renderContent()}</>;
+  }
+
+  renderContent() {
+    const { loading, children, error } = this.props;
+    if (error) {
+      return null;
+    }
+    if (loading) {
+      return <Loading />;
+    }
+    return children;
+  }
+}
+
+export default PageActions;
diff --git a/scm-ui-components/packages/ui-components/src/layout/index.js b/scm-ui-components/packages/ui-components/src/layout/index.js
index c93fe3b496..7708c45c99 100644
--- a/scm-ui-components/packages/ui-components/src/layout/index.js
+++ b/scm-ui-components/packages/ui-components/src/layout/index.js
@@ -3,6 +3,7 @@
 export { default as Footer } from "./Footer.js";
 export { default as Header } from "./Header.js";
 export { default as Page } from "./Page.js";
+export { default as PageActions } from "./PageActions.js";
 export { default as Subtitle } from "./Subtitle.js";
 export { default as Title } from "./Title.js";