feat: show commit list

src/api-client/repository.js

@@ -33,12 +33,18 @@ function addRepositoryMethods(client) {
   };
 
 
-  client.getCommits = (projectId, ref = "master") => {
+  client.getCommits = (projectId, ref = "master", max = 100) => {
     let headers = client.getBasicHeaders();
     headers.append("Content-Type", "application/json");
-    return client.clientFetch(`${client.baseUrl}/projects/${projectId}/repository/commits?ref_name=${ref}`, {
+
+    const queryParams = {
+      ref_name: ref,
+      per_page: max
+    };
+    return client.clientFetch(`${client.baseUrl}/projects/${projectId}/repository/commits`, {
       method: "GET",
-      headers: headers
+      headers: headers,
+      queryParams
     })
       .then(resp => {
         if (resp.data.length > 0)

src/merge-request/MergeRequest.container.js

@@ -115,6 +115,8 @@ class MergeRequestContainer extends Component {
     return <MergeRequestPresent
       title={this.state.title}
       author={this.state.author}
+      location={this.props.location}
+      externalUrl={this.props.externalUrl}
       externalMRUrl={externalMRUrl}
       externalMROverviewUrl={externalMROverviewUrl}
       changes={this.state.changes}

src/merge-request/MergeRequest.present.js

@@ -19,18 +19,20 @@
 import React, { Component } from "react";
 import { Row, Col, Badge, ListGroupItem, Nav, NavItem } from "reactstrap";
 import { NavLink, Switch, Route } from "react-router-dom";
-import {
-  UserAvatar, ExternalLink, TimeCaption, TooltipToggleButton, ExternalIconLink,
-  Clipboard, RenkuNavLink
-} from "../utils/UIComponents";
-import { Contribution, NewContribution } from "../contribution";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import {
   faComments, faCodeBranch, faListUl,
   faLongArrowAltLeft as faLeftArrow
 } from "@fortawesome/free-solid-svg-icons";
 import { faGitlab } from "@fortawesome/free-brands-svg-icons";
 
+import {
+  UserAvatar, ExternalLink, TimeCaption, TooltipToggleButton, ExternalIconLink, RenkuNavLink
+} from "../utils/UIComponents";
+import { Contribution, NewContribution } from "../contribution";
+import { CommitsView } from "../utils/Commits";
+
+
 function MergeRequestHeader(props) {
 
   const buttonGit = <ExternalIconLink tooltip="Open in GitLab" icon={faGitlab} to={props.externalMRUrl} />;
@@ -87,43 +89,6 @@ function ContributionsView(props) {
   ];
 }
 
-function SingleCommit(props) {
-  return <ListGroupItem className="pr-0 pl-0 pt-1 pb-1" style={{ border: "none" }}>
-    <Row>
-      <Col sm={9} md={9}>
-        <div className="d-flex project-list-row mb-3">
-          <div className="issue-text-crop">
-            <b>
-              <span className="issue-title">
-                {props.commit.message}
-              </span>
-            </b><br />
-            <span className="issues-description">
-              <div>
-                <TimeCaption caption={props.commit.author_name + " created"} time={props.commit.created_at} />
-              </div>
-            </span>
-          </div>
-        </div>
-      </Col>
-      <Col sm={3} md={3} className="float-right" style={{ textAlign: "end" }}>
-        <span className="text-muted">
-          <small>{props.commit.short_id}</small> <Clipboard clipboardText={props.commit.id} />
-        </span>
-      </Col>
-    </Row>
-  </ListGroupItem>;
-}
-
-function CommitsView(props) {
-  const commits = props.commits
-    .map(commit => <SingleCommit key={commit.id} commit={commit} {...props} />);
-  return <Row key="simple"><Col>
-    <br />
-    {commits}
-  </Col></Row>;
-}
-
 function ChangesView(props) {
 
   const opaqueChanges = props.changes
@@ -154,8 +119,8 @@ class MergeRequestPresent extends Component {
       <Row key="description" className="pb-2">
         <Col sm={11}>
           <p key="lead" className="lead">
-            {this.props.author.name} wants to merge changes from branch
-            <em><strong>{this.props.source_branch}</strong></em> into
+            {this.props.author.name} wants to merge changes from branch&nbsp;
+            <em><strong>{this.props.source_branch}</strong></em> into&nbsp;
             <em><strong>{this.props.target_branch}</strong></em>.
           </p>
         </Col>
@@ -170,7 +135,15 @@ class MergeRequestPresent extends Component {
             <ChangesView {...this.props} />
           } />
           <Route path={this.props.mergeRequestCommitsUrl} render={props =>
-            <CommitsView {...this.props} />
+            <div style={{ paddingTop: "20px" }}>
+              <CommitsView
+                commits={this.props.commits}
+                fetched={true}
+                fetching={false}
+                urlRepository={this.props.externalUrl}
+                urlDiff={`${this.props.externalMRUrl}?commit_id=`}
+              />
+            </div>
           } />
         </Switch>
       </Col>

src/model/GlobalSchema.js

@@ -24,12 +24,13 @@
  */
 
 import { Schema } from "./index";
-import { notebooksSchema, userSchema, projectsSchema } from "./RenkuModels";
+import { notebooksSchema, userSchema, projectsSchema, projectGlobalSchema } from "./RenkuModels";
 
 const globalSchema = new Schema({
   notebooks: { schema: notebooksSchema },
   user: { schema: userSchema },
   projects: { schema: projectsSchema },
+  project: { schema: projectGlobalSchema }
 });
 
 export { globalSchema };

src/model/RenkuModels.js

@@ -172,6 +172,37 @@ const projectSchema = new Schema({
   }
 });
 
+const projectGlobalSchema = new Schema({
+  metadata: {
+    schema: {
+      exists: { initial: null, mandatory: true },
+
+      id: { initial: null, mandatory: true }, // id
+      namespace: { initial: null, mandatory: true }, // namespace.full_path
+      path: { initial: null, mandatory: true }, // path
+      pathWithNamespace: { initial: null, mandatory: true }, // path_with_namespace
+      repositoryUrl: { initial: null, mandatory: true }, // web_url
+
+      fetched: { initial: null },
+      fetching: { initial: false },
+    }
+  },
+  commits: {
+    schema: {
+      list: { initial: [], mandatory: true },
+
+      fetched: { initial: null },
+      fetching: { initial: false },
+    }
+  },
+  filters: {
+    schema: {
+      branch: { initial: { name: "master" }, mandatory: true },
+      commit: { initial: { id: "latest" }, mandatory: true },
+    }
+  }
+});
+
 const notebooksSchema = new Schema({
   notebooks: {
     schema: {
@@ -352,6 +383,8 @@ const addDatasetToProjectSchema = new Schema({
 });
 
 
-export { userSchema, metaSchema, displaySchema, newProjectSchema, projectSchema, forkProjectSchema };
-export { notebooksSchema, projectsSchema, datasetFormSchema, issueFormSchema, datasetImportFormSchema };
-export { addDatasetToProjectSchema };
+export {
+  userSchema, metaSchema, displaySchema, newProjectSchema, projectSchema, forkProjectSchema, notebooksSchema,
+  projectsSchema, datasetFormSchema, issueFormSchema, datasetImportFormSchema, projectGlobalSchema,
+  addDatasetToProjectSchema
+};

src/model/index.js

@@ -25,5 +25,9 @@
 
 import { Schema, StateModel, StateKind, SubModel, SpecialPropVal, StatusHelper } from "./Model";
 import { globalSchema } from "./GlobalSchema";
+import { projectGlobalSchema, projectSchema } from "./RenkuModels";
 
-export { globalSchema, Schema, StateModel, StateKind, SubModel, SpecialPropVal, StatusHelper };
+export {
+  globalSchema, Schema, StateModel, StateKind, SubModel, SpecialPropVal, StatusHelper, projectGlobalSchema,
+  projectSchema
+};

src/notebooks/Notebooks.container.js

@@ -24,6 +24,7 @@ import { StartNotebookServer as StartNotebookServerPresent, NotebooksDisabled }
 import { Notebooks as NotebooksPresent } from "./Notebooks.present";
 import { CheckNotebookIcon } from "./Notebooks.present";
 import { StatusHelper } from "../model/Model";
+import { ProjectCoordinator } from "../project";
 
 /**
  * Display the list of Notebook servers
@@ -145,6 +146,9 @@ class StartNotebookServer extends Component {
     this.model = props.model.subModel("notebooks");
     this.userModel = props.model.subModel("user");
     this.coordinator = new NotebooksCoordinator(props.client, this.model, this.userModel);
+    // TODO: this should go away when moving all project content to projectCoordinator
+    this.projectModel = props.model.subModel("project");
+    this.projectCoordinator = new ProjectCoordinator(props.client, props.model.subModel("project"));
     // temporarily reset data since notebooks model was not designed to be static
     this.coordinator.reset();
 
@@ -243,13 +247,19 @@ class StartNotebookServer extends Component {
 
   async refreshCommits() {
     if (this._isMounted) {
-      if (this.model.get("data.fetching"))
-        return;
+      if (!this.projectModel.get("commits.fetching"))
+        await this.projectCoordinator.fetchCommits();
+      this.selectCommitWhenReady();
+    }
+  }
 
-      await this.coordinator.fetchCommits();
-      if (this._isMounted)
+  // TODO: ugly workaround until branches and commits will be unified in projectCoordinator
+  async selectCommitWhenReady() {
+    if (this._isMounted) {
+      if (this.projectModel.get("commits.fetching"))
+        setTimeout(() => { this.selectCommitWhenReady(); }, 100);
+      else
         this.selectCommit();
-
     }
   }
 
@@ -258,8 +268,8 @@ class StartNotebookServer extends Component {
       // filter the list of commits according to the constraints
       const maximum = this.model.get("filters.displayedCommits");
       const commits = maximum && parseInt(maximum) > 0 ?
-        this.model.get("data.commits").slice(0, maximum) :
-        this.model.get("data.commits");
+        this.projectModel.get("commits.list").slice(0, maximum) :
+        this.projectModel.get("commits.list");
       let commit = commits[0];
 
       // find the proper commit or return
@@ -339,7 +349,9 @@ class StartNotebookServer extends Component {
     const augmentedState = {
       ...state.notebooks,
       data: {
-        ...state.notebooks.data,
+        fetched: state.project.commits.fetched,
+        fetching: state.project.commits.fetching,
+        commits: state.project.commits.list,
         branches: ownProps.inherited.branches,
         autosaved: ownProps.inherited.autosaved
       },
@@ -388,6 +400,8 @@ class CheckNotebookStatus extends Component {
     this.model = props.model.subModel("notebooks");
     this.userModel = props.model.subModel("user");
     this.coordinator = new NotebooksCoordinator(props.client, this.model, this.userModel);
+    // TODO: this should go away when moving all project content to projectCoordinator
+    this.projectCoordinator = new ProjectCoordinator(props.client, props.model.subModel("project"));
     // temporarily reset data since notebooks model was not designed to be static
     this.coordinator.reset();
 
@@ -402,7 +416,7 @@ class CheckNotebookStatus extends Component {
     if (!scope.branch || !scope.commit)
       return;
     if (scope.commit === "latest") {
-      let commits = await this.coordinator.fetchCommits();
+      let commits = await this.projectCoordinator.fetchCommits();
       scope.commit = commits[0];
       this.coordinator.setNotebookFilters(scope);
     }

src/notebooks/Notebooks.state.js

@@ -699,29 +699,6 @@ class NotebooksCoordinator {
         throw error;
       });
   }
-
-
-  // * Fetch commits -- to be moved * //
-  async fetchCommits() {
-    this.model.set("data.fetching", true);
-    const filters = this.model.get("filters");
-    const projectPathWithNamespace = `${encodeURIComponent(filters.namespace)}%2F${filters.project}`;
-    return this.client.getCommits(projectPathWithNamespace, filters.branch.name)
-      .then(resp => {
-        this.model.setObject({
-          data: {
-            fetching: false,
-            fetched: new Date(),
-            commits: { $set: resp.data }
-          }
-        });
-        return resp.data;
-      })
-      .catch(error => {
-        this.model.set("data.fetching", false);
-        throw error;
-      });
-  }
 }
 
 export { NotebooksHelper, ExpectedAnnotations, NotebooksCoordinator };