From dcffb0cc095f71c10141481428560fc4dcb8045e Mon Sep 17 00:00:00 2001
From: Lukas Brabec <lbrabec@redhat.com>
Date: Mar 18 2020 10:59:43 +0000
Subject: basic login support


---

diff --git a/src/index.css b/src/index.css
index c263cb0..35220cd 100644
--- a/src/index.css
+++ b/src/index.css
@@ -146,6 +146,7 @@ body {
     padding: 10pt 8pt 8pt 8pt;
     border-radius: 4px 4px 0 0;
     color: #293a5e;
+    font-weight: bold;
   }
 
   .cardTitle a {
diff --git a/src/index.js b/src/index.js
index 34e8218..291fb1b 100644
--- a/src/index.js
+++ b/src/index.js
@@ -75,6 +75,7 @@ class Card extends Component {
 
         return (
             <Draggable
+                isDragDisabled={this.props.dragDisabled}
                 key={this.props.item.id}
                 draggableId={this.props.item.id}
                 index={this.props.index}>
@@ -131,7 +132,7 @@ class Stage extends Component {
                     style={getListStyle(snapshot.isDraggingOver)}
                     className="stageList">
                     {cardList.map((item, index) => (
-                        <Card item={item} index={index} key={"card"+item.id}/>
+                        <Card item={item} index={index} key={"card"+item.id} dragDisabled={this.props.dragDisabled}/>
                     ))}
                     {provided.placeholder}
                 </div>
@@ -255,15 +256,20 @@ class Board extends Component {
     }
 
     render() {
+        console.log(this.props.user)
         return (
             <div className="boardContainer">
                 <DragDropContext onDragStart={this.onDragStart} onDragEnd={this.onDragEnd}>
-                    {Object.keys(this.state.stages).map(stage_name => (
+                    {Object.keys(this.state.stages).map(stage_name => {
+                        return (
                         <Stage key={"stageColumn"+stage_name}
                             stage_name={stage_name}
                             stage={this.state.stages[stage_name]}
-                            dropDisabled={this.state.start_stage===stage_name} />
-                    ))}
+                            dropDisabled={this.state.start_stage === stage_name}
+                            dragDisabled={this.props.user === ''}
+                            user={this.props.user} />
+                        )
+                    })}
                 </DragDropContext>
             </div>
         );
@@ -275,25 +281,43 @@ class Project extends Component {
         return (
             <div className="projectContainer">
                 <div className="boardTitle"><b>Kanban</b> {this.props.project.name}</div>
-                <Board project={this.props.project} />
+                <Board project={this.props.project} user={this.props.user}/>
             </div>
         )
     }
 }
 
+
+class LoginButton extends Component {
+    render() {
+        if(this.props.user === '') {
+            return (
+                <div className='sidebarItem'><a href={window.env.API + 'oidc_login?redirect=' + window.location}>Log In</a></div>
+                )
+        } else {
+            return (
+                <div className='sidebarItem'><a href={window.env.API + 'oidc_logout?redirect=' + window.location}>Log Out {this.props.user}</a></div>
+                )
+        }
+
+    }
+}
+
+
 class AppInner extends Component {
     render() {
         return (
             <div className="appContainer">
                 <div className="sidebar">
                     <div className="sidebarTitle">Projects</div>
-                        {this.props.projects.map((project) => (
-                            <div key={"sideBarLink"+project.name} className={"sidebarItem "+(project.name===this.props.selected.name? "selected" : "")}>
-                                <Link to={'/'+project.name}>{project.name}</Link>
-                            </div>
-                        ))}
+                    {this.props.projects.map((project) => (
+                        <div key={"sideBarLink"+project.name} className={"sidebarItem "+(project.name===this.props.selected.name? "selected" : "")}>
+                            <Link to={'/'+project.name}>{project.name}</Link>
+                        </div>
+                    ))}
+                    <LoginButton user={this.props.user} />
                 </div>
-                <Project project={this.props.selected}/>
+                <Project project={this.props.selected} user={this.props.user}/>
             </div>
         )
     }
@@ -312,17 +336,25 @@ class AppLoading extends Component {
 class App extends Component {
     state = {
         projects: [],
-        selected: 0
+        selected: 0,
+        user: ''
     }
 
     componentDidMount(){
         console.log(window.env.CORS_PROXY_API)
         console.log(window.env.PAGURE_CONFIG_JSON)
+
         fetch(window.env.CORS_PROXY_API + window.env.PAGURE_CONFIG_JSON)
-        .then(blob => blob.json())
-        .then(data => {
-            this.setState({projects: data.projects})
-        })
+            .then(blob => blob.json())
+            .then(data => {
+                this.setState({projects: data.projects})
+            })
+
+        fetch(window.env.API + 'current_user', {credentials: 'include'})
+            .then(blob => blob.json())
+            .then(data => {
+                this.setState({user: data.user})
+            })
     }
 
     nameToIndex(name){
@@ -345,14 +377,16 @@ class App extends Component {
                                exact
                                render={(props) => (<AppInner key={"app"+projects[0].name} {...props}
                                                              projects={projects}
-                                                             selected={projects[0]}/>)}/>
+                                                             selected={projects[0]}
+                                                             user={this.state.user} />)}/>
                         {
                             projects.map(project => (
                                 <Route key={"route"+project.name}
                                        path={'/'+project.name}
                                        render={(props) => (<AppInner key={"app"+project.name} {...props}
                                                                      projects={projects}
-                                                                     selected={project} />)} />
+                                                                     selected={project}
+                                                                     user={this.state.user} />)} />
                             ))
                         }
                     </Switch>