@truedat/dd 4.30.2 → 4.30.6

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # Changelog
 
+## [4.30.6] 2021-10-15
+
+### Fixed
+
+- [TD-3874] Allow rule creation specifying domain for shared concepts
+
+## [4.30.5] 2021-10-15
+
+### Added
+
+- [TD-4226] i18n for grant checkout button
+
+## [4.30.3] 2021-10-07
+
+### Added
+
+- [TD-4044] Support for approving grant requests
+
 ## [4.30.1] 2021-10-06
 
 ### Added

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@truedat/dd",
-  "version": "4.30.2",
+  "version": "4.30.6",
   "description": "Truedat Web Data Dictionary",
   "sideEffects": false,
   "jsnext:main": "src/index.js",
@@ -34,7 +34,7 @@
     "@testing-library/jest-dom": "^5.14.1",
     "@testing-library/react": "^12.0.0",
     "@testing-library/user-event": "^13.2.1",
-    "@truedat/test": "4.30.1",
+    "@truedat/test": "4.30.6",
     "babel-jest": "^27.0.6",
     "babel-plugin-dynamic-import-node": "^2.3.3",
     "babel-plugin-lodash": "^3.3.4",
@@ -84,9 +84,9 @@
     ]
   },
   "dependencies": {
-    "@truedat/auth": "4.30.2",
-    "@truedat/core": "4.30.2",
-    "@truedat/df": "4.30.2",
+    "@truedat/auth": "4.30.6",
+    "@truedat/core": "4.30.6",
+    "@truedat/df": "4.30.6",
     "lodash": "^4.17.21",
     "path-to-regexp": "^1.7.0",
     "prop-types": "^15.7.2",
@@ -107,5 +107,5 @@
     "react-dom": ">= 16.8.6 < 17",
     "semantic-ui-react": ">= 0.88.2 < 2.1"
   },
-  "gitHead": "d1b2a5b74458267ecb68a30eb3cc331a6899a67f"
+  "gitHead": "f23b3cf877ac9383f2e638ddcd685d173ac6142a"
 }

package/src/api.js

@@ -7,6 +7,7 @@ const API_DATA_STRUCTURE_VERSION = "/api/data_structures/:id/versions/:version";
 const API_GRANT_FILTERS_SEARCH = "/api/grant_filters/search";
 const API_PROFILE_EXECUTION = "/api/profile_executions/:id";
 const API_GRANT_REQUEST = "/api/grant_requests/:id";
+const API_GRANT_REQUEST_APPROVALS = "/api/grant_requests/:id/approvals";
 const API_GRANT_REQUEST_GROUP = "/api/grant_request_groups";
 const API_GRANT_REQUESTS = "/api/grant_requests";
 const API_GRANTS_CSV = "/api/grants/csv";
@@ -49,6 +50,7 @@ export {
   API_PROFILE_EXECUTION,
   API_GRANT_FILTERS_SEARCH,
   API_GRANT_REQUEST,
+  API_GRANT_REQUEST_APPROVALS,
   API_GRANT_REQUEST_GROUP,
   API_GRANT_REQUESTS,
   API_GRANTS_SEARCH,

package/src/components/GrantRequest.js

@@ -8,6 +8,7 @@ import { useIntl } from "react-intl";
 import { Header, Grid, Icon, Segment, List, Label } from "semantic-ui-react";
 import { getGrantRequestTemplate } from "../selectors";
 import GrantRequestCrumbs from "./GrantRequestCrumbs";
+import GrantRequestApprovalPopup from "./GrantRequestApprovalPopup";
 
 const DynamicFormViewer = React.lazy(() =>
   import("@truedat/df/components/DynamicFormViewer")
@@ -44,7 +45,17 @@ export const GrantRequest = ({ grantRequest, template }) => {
             </Header>
           </Grid.Column>
           <Grid.Column width={4} textAlign="right">
-            {/*TODO :: <GrantRequestActions /> */}
+            <GrantRequestApprovalPopup
+              content={formatMessage({ id: "grantRequest.actions.approve" })}
+              primary
+              grantRequest={grantRequest}
+            />
+            <GrantRequestApprovalPopup
+              content={formatMessage({ id: "grantRequest.actions.reject" })}
+              secondary
+              isRejection
+              grantRequest={grantRequest}
+            />
           </Grid.Column>
         </Grid>
         <List size="big" relaxed="very">

package/src/components/GrantRequestApprovalForm.js

@@ -0,0 +1,127 @@
+import _ from "lodash/fp";
+import React from "react";
+import { useForm, Controller } from "react-hook-form";
+import { Button, Container, Form, Header } from "semantic-ui-react";
+import PropTypes from "prop-types";
+import { useIntl } from "react-intl";
+import { connect } from "react-redux";
+import { createGrantRequestApproval } from "../routines";
+
+export const GrantRequestApprovalForm = ({
+  grantRequest,
+  isRejection,
+  saving,
+  createGrantRequestApproval,
+}) => {
+  const { formatMessage } = useIntl();
+
+  const { handleSubmit, control, formState } = useForm({
+    mode: "all",
+    defaultValues: {
+      role: null,
+      comments: "",
+    },
+  });
+  const { isDirty, isValid } = formState;
+
+  const dropdownOptions = _.flow(
+    _.get("pending_roles"),
+    _.map((role) => ({ key: role, value: role, text: role }))
+  )(grantRequest);
+
+  const onSubmit = (formValues) => {
+    const { id, domain_id } = grantRequest;
+    const approval = {
+      ...formValues,
+      domain_id,
+      is_rejection: isRejection,
+    };
+    createGrantRequestApproval({
+      grantRequestId: id,
+      approval,
+    });
+  };
+  return (
+    <Container style={{ width: "400px" }}>
+      <Header
+        as="h2"
+        content={formatMessage({
+          id: isRejection
+            ? "grantRequestApproval.form.reject"
+            : "grantRequestApproval.form.approve",
+        })}
+      />
+      <Form onSubmit={handleSubmit(onSubmit)}>
+        <Controller
+          control={control}
+          name="role"
+          rules={{ validate: (v) => !_.isEmpty(v) }}
+          render={({ onBlur, onChange, value }, { invalid }) => (
+            <Form.Dropdown
+              placeholder={formatMessage({
+                id: "grantRequestApproval.form.role.placeholder",
+              })}
+              label={formatMessage({
+                id: "grantRequestApproval.form.role.label",
+              })}
+              error={invalid}
+              onBlur={onBlur}
+              value={value}
+              onChange={(_, { value }) => onChange(value)}
+              selection
+              required
+              options={dropdownOptions}
+            />
+          )}
+        />
+        <Controller
+          control={control}
+          name="comments"
+          render={({ onBlur, onChange, value }, { invalid }) => (
+            <Form.TextArea
+              data-testid="comments-id"
+              label={formatMessage({
+                id: "grantRequestApproval.form.comments.label",
+              })}
+              placeholder={formatMessage({
+                id: "grantRequestApproval.form.comments.placeholder",
+              })}
+              value={value}
+              onBlur={onBlur}
+              error={invalid}
+              onChange={(_, { value }) => onChange(value)}
+            />
+          )}
+        />
+        <div className="actions">
+          <Button
+            type="submit"
+            disabled={!isDirty || !isValid}
+            loading={saving}
+            primary
+            content={formatMessage({
+              id: isRejection
+                ? "grantRequest.actions.reject"
+                : "grantRequest.actions.approve",
+            })}
+          />
+        </div>
+      </Form>
+    </Container>
+  );
+};
+
+GrantRequestApprovalForm.propTypes = {
+  grantRequest: PropTypes.object,
+  isRejection: PropTypes.bool,
+  createGrantRequestApproval: PropTypes.func,
+  saving: PropTypes.bool,
+};
+
+export const mapStateToProps = (state) => ({
+  saving: state?.creatingGrantRequestApproval,
+});
+
+export default connect(mapStateToProps, { createGrantRequestApproval })(
+  GrantRequestApprovalForm
+);

package/src/components/GrantRequestApprovalPopup.js

@@ -0,0 +1,43 @@
+import _ from "lodash/fp";
+import React, { useState } from "react";
+import { Button, Popup } from "semantic-ui-react";
+import PropTypes from "prop-types";
+import GrantRequestApprovalForm from "./GrantRequestApprovalForm";
+
+export const GrantRequestApprovalPopup = ({
+  isRejection,
+  grantRequest,
+  ...buttonProps
+}) => {
+  const [open, setOpen] = useState(false);
+
+  return (
+    <Popup
+      on="click"
+      basic
+      flowing
+      content={
+        <GrantRequestApprovalForm
+          isRejection={isRejection}
+          grantRequest={grantRequest}
+        />
+      }
+      onOpen={() => setOpen(true)}
+      onClose={() => setOpen(false)}
+      open={open}
+      position="bottom right"
+      size="large"
+      positionFixed
+      trigger={
+        <Button className="button icon group-actions" {...buttonProps} />
+      }
+    />
+  );
+};
+
+GrantRequestApprovalPopup.propTypes = {
+  grantRequest: PropTypes.object,
+  isRejection: PropTypes.bool,
+  saving: PropTypes.bool,
+};
+export default GrantRequestApprovalPopup;

package/src/components/GrantRequestApprovals.js

@@ -0,0 +1,41 @@
+import React from "react";
+import { connect } from "react-redux";
+import PropTypes from "prop-types";
+import { useIntl } from "react-intl";
+import { Header, Icon, Segment } from "semantic-ui-react";
+import {
+  getGrantRequests,
+  getGrantRequestsApprovalColumns
+} from "../selectors";
+import GrantRequests from "./GrantRequests";
+
+export const GrantRequestApprovals = ({ columns, grantRequests }) => {
+  const { formatMessage } = useIntl();
+
+  return (
+    <Segment>
+      <Header as="h2">
+        <Icon circular name="key" />
+        <Header.Content>
+          {formatMessage({ id: "grantRequests.header.approve" })}
+          <Header.Subheader>
+            {formatMessage({ id: "grantRequests.subheader.approve" })}
+          </Header.Subheader>
+        </Header.Content>
+      </Header>
+      <GrantRequests columns={columns} grantRequests={grantRequests} />
+    </Segment>
+  );
+};
+
+const mapStateToProps = state => ({
+  columns: getGrantRequestsApprovalColumns(state),
+  grantRequests: getGrantRequests(state)
+});
+
+GrantRequestApprovals.propTypes = {
+  columns: PropTypes.array,
+  grantRequests: PropTypes.array
+};
+
+export default connect(mapStateToProps)(GrantRequestApprovals);

package/src/components/GrantRoutes.js

@@ -4,13 +4,15 @@ import PropTypes from "prop-types";
 import { Route, Switch } from "react-router-dom";
 import { connect } from "react-redux";
 import {
+  GRANT_REQUEST_APPROVALS,
   GRANT_REQUEST,
   GRANT_REQUESTS,
   GRANTS_REQUESTS_CHECKOUT,
   GRANTS,
   MY_GRANT_REQUESTS,
-  MY_GRANTS,
+  MY_GRANTS
 } from "@truedat/core/routes";
+import GrantRequestApprovals from "./GrantRequestApprovals";
 import StructureGrantCartCheckout from "./StructureGrantCartCheckout";
 import GrantFiltersLoader from "./GrantFiltersLoader";
 import GrantRequestsLoader from "./GrantRequestsLoader";
@@ -50,6 +52,20 @@ export const GrantRoutes = ({ grantRequestLoaded }) => (
         </>
       )}
     />
+    <Route
+      path={GRANT_REQUEST_APPROVALS}
+      render={() => (
+        <>
+          <GrantRequestsLoader
+            defaultPayload={{
+              action: "approve",
+              status: "pending"
+            }}
+          />
+          <GrantRequestApprovals />
+        </>
+      )}
+    />
     <Route
       path={MY_GRANT_REQUESTS}
       render={() => (
@@ -57,7 +73,7 @@ export const GrantRoutes = ({ grantRequestLoaded }) => (
           <GrantRequestsLoader
             defaultPayload={{
               user: "me",
-              status: "pending,approved,rejected,processing",
+              status: "pending,approved,rejected,processing"
             }}
           />
           <MyGrantRequests />
@@ -86,12 +102,12 @@ export const GrantRoutes = ({ grantRequestLoaded }) => (
   </>
 );
 
-const mapStateToProps = (state) => ({
-  grantRequestLoaded: !_.isEmpty(state.grantRequest),
+const mapStateToProps = state => ({
+  grantRequestLoaded: !_.isEmpty(state.grantRequest)
 });
 
 GrantRoutes.propTypes = {
-  grantRequestLoaded: PropTypes.bool,
+  grantRequestLoaded: PropTypes.bool
 };
 
 export default connect(mapStateToProps)(GrantRoutes);

package/src/components/MyGrantRequests.js

@@ -5,7 +5,7 @@ import PropTypes from "prop-types";
 import { useIntl } from "react-intl";
 import { Checkbox, Form, Header, Icon, Segment } from "semantic-ui-react";
 import { useForm, Controller } from "react-hook-form";
-import { getMyGrantRequests, getMyGrantRequestsColumns } from "../selectors";
+import { getGrantRequests, getMyGrantRequestsColumns } from "../selectors";
 import { setGrantRequestsQuery } from "../routines";
 import GrantRequests from "./GrantRequests";
 
@@ -78,7 +78,7 @@ export const MyGrantRequests = ({
 
 const mapStateToProps = (state) => ({
   columns: getMyGrantRequestsColumns(state),
-  grantRequests: getMyGrantRequests(state),
+  grantRequests: getGrantRequests(state),
 });
 
 MyGrantRequests.propTypes = {

package/src/components/StructureGrantCart.js

@@ -20,7 +20,6 @@ import { GRANTS_REQUESTS_CHECKOUT, STRUCTURES } from "@truedat/core/routes";
 import { FiltersGrid } from "@truedat/dq/components/ruleImplementationForm/FiltersGrid";
 import { getRuleImplementationOperators } from "@truedat/dq/selectors/getRuleImplementationOperators";
 import {
-  addGrantRequestToCart,
   removeGrantRequestFromCart,
   updateGrantRequestFilter,
 } from "../routines";
@@ -127,7 +126,7 @@ export const StructureGrantCart = ({
         <>
           <Divider />
           <Button as={Link} to={linkTo.GRANTS_REQUESTS_CHECKOUT()}>
-            Checkout
+            {formatMessage({ id: `structure.grant.cart.checkout` })}
           </Button>
         </>
       )}
@@ -139,7 +138,6 @@ StructureGrantCart.propTypes = {
   structure: PropTypes.object,
   grantRequestsCart: PropTypes.object,
   typeOperators: PropTypes.array,
-  addGrantRequestToCart: PropTypes.func,
   removeGrantRequestFromCart: PropTypes.func,
   updateGrantRequestFilter: PropTypes.func,
 };
@@ -156,7 +154,6 @@ const mapStateToProps = (state) => {
 const mapDispatchToProps = (dispatch) =>
   bindActionCreators(
     {
-      addGrantRequestToCart,
       removeGrantRequestFromCart,
       updateGrantRequestFilter,
     },

package/src/components/__tests__/GrantRequestApprovalForm.spec.js

@@ -0,0 +1,87 @@
+import React from "react";
+import { waitFor } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { render } from "@truedat/test/render";
+import { GrantRequestApprovalForm } from "../GrantRequestApprovalForm";
+
+describe("<GrantRequestApprovalForm />", () => {
+  const grantRequest = {
+    id: 3,
+    domain_id: 8,
+    pending_roles: ["role1", "role2"],
+  };
+  const createGrantRequestApproval = jest.fn();
+  const saving = false;
+  const props = {
+    grantRequest,
+    isRejection: false,
+    saving,
+    createGrantRequestApproval,
+  };
+  const renderOpts = {
+    messages: {
+      en: {
+        "grantRequestApproval.form.approve": "approve",
+        "grantRequestApproval.form.reject": "reject",
+        "grantRequestApproval.form.role.label": "role_label",
+        "grantRequestApproval.form.role.placeholder": "role_placeholder",
+        "grantRequestApproval.form.comments.label": "comments_label",
+        "grantRequestApproval.form.comments.placeholder":
+          "comments_placeholder",
+        "grantRequest.actions.approve": "submit",
+        "grantRequest.actions.reject": "submit",
+      },
+    },
+  };
+
+  it("matches the latest snapshot", () => {
+    const { container } = render(
+      <GrantRequestApprovalForm {...props} />,
+      renderOpts
+    );
+    expect(container).toMatchSnapshot();
+  });
+
+  it("enables submit button when we select a role", async () => {
+    const { findByText, queryByText } = render(
+      <GrantRequestApprovalForm {...props} />,
+      renderOpts
+    );
+
+    expect(queryByText(/submit/)).toBeDisabled();
+    userEvent.click(await findByText(/role1/));
+    await waitFor(() => {
+      expect(queryByText(/submit/)).not.toBeDisabled();
+    });
+  });
+
+  it("invokes function when submit button clicked", async () => {
+    const { findByText, queryByText, queryByTestId } = render(
+      <GrantRequestApprovalForm {...props} />,
+      renderOpts
+    );
+
+    expect(queryByText(/submit/)).toBeDisabled();
+    userEvent.click(await findByText(/role1/));
+    await waitFor(() => {
+      expect(queryByText(/submit/)).not.toBeDisabled();
+    });
+
+    userEvent.type(queryByTestId("comments-id"), "comment");
+    userEvent.click(await findByText(/submit/));
+    await waitFor(() => {
+      expect(createGrantRequestApproval.mock.calls.length).toBe(1);
+    });
+    expect(createGrantRequestApproval).toHaveBeenCalledWith(
+      expect.objectContaining({
+        grantRequestId: 3,
+        approval: {
+          domain_id: 8,
+          is_rejection: false,
+          role: "role1",
+          comments: "comment",
+        },
+      })
+    );
+  });
+});

package/src/components/__tests__/GrantRequestApprovalPopup.spec.js

@@ -0,0 +1,16 @@
+import React from "react";
+import { shallow } from "enzyme";
+import GrantRequestApprovalPopup from "../GrantRequestApprovalPopup";
+
+describe("<GrantRequestApprovalPopup />", () => {
+  const props = {
+    isRejection: false,
+    grantRequest: { id: 2 },
+    content: "button content",
+    primary: true,
+  };
+  it("matches the latest snapshot", () => {
+    const wrapper = shallow(<GrantRequestApprovalPopup {...props} />);
+    expect(wrapper).toMatchSnapshot();
+  });
+});

package/src/components/__tests__/__snapshots__/GrantRequest.spec.js.snap

@@ -47,7 +47,18 @@ exports[`<GrantRequest /> matches the latest snapshot 1`] = `
       </div>
       <div
         class="right aligned four wide column"
-      />
+      >
+        <button
+          class="ui primary button button icon group-actions"
+        >
+          grantRequest.actions.approve
+        </button>
+        <button
+          class="ui secondary button button icon group-actions"
+        >
+          grantRequest.actions.reject
+        </button>
+      </div>
     </div>
     <div
       class="ui big very relaxed list"

package/src/components/__tests__/__snapshots__/GrantRequestApprovalForm.spec.js.snap

@@ -0,0 +1,101 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<GrantRequestApprovalForm /> matches the latest snapshot 1`] = `
+<div>
+  <div
+    class="ui container"
+    style="width: 400px;"
+  >
+    <h2
+      class="ui header"
+    >
+      approve
+    </h2>
+    <form
+      class="ui form"
+    >
+      <div
+        class="required field"
+      >
+        <label>
+          role_label
+        </label>
+        <div
+          aria-expanded="false"
+          class="ui selection dropdown"
+          required=""
+          role="listbox"
+          tabindex="0"
+        >
+          <div
+            aria-atomic="true"
+            aria-live="polite"
+            class="divider default text"
+            role="alert"
+          >
+            role_placeholder
+          </div>
+          <i
+            aria-hidden="true"
+            class="dropdown icon"
+          />
+          <div
+            class="menu transition"
+          >
+            <div
+              aria-checked="false"
+              aria-selected="true"
+              class="selected item"
+              role="option"
+              style="pointer-events: all;"
+            >
+              <span
+                class="text"
+              >
+                role1
+              </span>
+            </div>
+            <div
+              aria-checked="false"
+              aria-selected="false"
+              class="item"
+              role="option"
+              style="pointer-events: all;"
+            >
+              <span
+                class="text"
+              >
+                role2
+              </span>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div
+        class="field"
+      >
+        <label>
+          comments_label
+        </label>
+        <textarea
+          data-testid="comments-id"
+          placeholder="comments_placeholder"
+          rows="3"
+        />
+      </div>
+      <div
+        class="actions"
+      >
+        <button
+          class="ui primary disabled button"
+          disabled=""
+          tabindex="-1"
+          type="submit"
+        >
+          submit
+        </button>
+      </div>
+    </form>
+  </div>
+</div>
+`;

package/src/components/__tests__/__snapshots__/GrantRequestApprovalPopup.spec.js.snap

@@ -0,0 +1,37 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<GrantRequestApprovalPopup /> matches the latest snapshot 1`] = `
+<Popup
+  basic={true}
+  content={
+    <Memo(Connect(GrantRequestApprovalForm))
+      grantRequest={
+        Object {
+          "id": 2,
+        }
+      }
+      isRejection={false}
+    />
+  }
+  disabled={false}
+  eventsEnabled={true}
+  flowing={true}
+  on="click"
+  onClose={[Function]}
+  onOpen={[Function]}
+  open={false}
+  pinned={false}
+  popperModifiers={Array []}
+  position="bottom right"
+  positionFixed={true}
+  size="large"
+  trigger={
+    <Button
+      as="button"
+      className="button icon group-actions"
+      content="button content"
+      primary={true}
+    />
+  }
+/>
+`;

package/src/components/__tests__/__snapshots__/GrantRoutes.spec.js.snap

@@ -14,6 +14,10 @@ exports[`<GrantRoutes /> matches the latest snapshot 1`] = `
     path="/my_grants"
     render={[Function]}
   />
+  <Route
+    path="/grant_request_approvals"
+    render={[Function]}
+  />
   <Route
     path="/my_grant_requests"
     render={[Function]}

package/src/messages/en.js

@@ -38,6 +38,8 @@ export default {
   "grant.header.end_date": "Expires",
   "grant.header.start_date": "Access granted",
   "grant.updated_at": "Last changed",
+  "grantRequest.actions.approve": "Approve",
+  "grantRequest.actions.reject": "Reject",
   "grantRequest.content.approved": "Approved",
   "grantRequest.content.empty": "Empty",
   "grantRequest.content.pending": "Pending",
@@ -45,18 +47,26 @@ export default {
   "grantRequest.content.processing": "Processing",
   "grantRequest.content.rejected": "Rejected",
   "grantRequest.crumb.title": "Request",
-  "grantRequest.header": "Grant request",
-  "grantRequests.empty": "No grant requests found",
-  "grantRequests.header": "Grant requests",
   "grantRequest.header.data_structure": "Data Structure",
   "grantRequest.header.path": "Path",
+  "grantRequest.header.status": "Status",
   "grantRequest.header.updated_at": "Updated",
   "grantRequest.header.user": "User",
-  "grantRequest.header.status": "Status",
+  "grantRequest.header": "Grant request",
+  "grantRequestApproval.form.approve": "Approve grant request",
+  "grantRequestApproval.form.comments.label": "Comments",
+  "grantRequestApproval.form.comments.placeholder": "Comments",
+  "grantRequestApproval.form.reject": "Reject grant request",
+  "grantRequestApproval.form.role.label": "Approval role",
+  "grantRequestApproval.form.role.placeholder": "Role",
+  "grantRequests.empty": "No grant requests found",
   "grantRequests.filters": "Filters",
+  "grantRequests.header.approve": "Approve grant requests",
   "grantRequests.header.me": "My grant requests",
-  "grantRequests.subheader": "Pending approval grant requests",
+  "grantRequests.header": "Grant requests",
+  "grantRequests.subheader.approve": "Grant requests pending approval",
   "grantRequests.subheader.me": "Grant requests requested by me",
+  "grantRequests.subheader": "Pending approval grant requests",
   "grants.actions.download.popup": "Select a grant",
   "grants.actions.download.tooltip": "Download to CSV",
   "grants.header": "Grants",
@@ -163,6 +173,7 @@ export default {
   "structure.grant.request_grant": "Request grant",
   "structure.grant.requested_grant": "Pending request",
   "structure.grant.cart": "Requested grants",
+  "structure.grant.cart.checkout": "Checkout",
   "structure.grant.cart.template": "Request information",
   "structure.grant.cart.template.placeholder": "Select request type",
   "structure.grant.cart.filters": "Filters for structure",

package/src/messages/es.js

@@ -39,6 +39,8 @@ export default {
   "grant.header.start_date": "Acceso desde",
   "grant.header.user": "Cuenta",
   "grant.updated_at": "Actualizada",
+  "grantRequest.actions.approve": "Aprobar",
+  "grantRequest.actions.reject": "Rechazar",
   "grantRequest.content.approved": "Aprobada",
   "grantRequest.content.empty": "Vacío",
   "grantRequest.content.pending": "Pendiente",
@@ -46,18 +48,27 @@ export default {
   "grantRequest.content.processing": "Procesando",
   "grantRequest.content.rejected": "Rechazada",
   "grantRequest.crumb.title": "Petición",
-  "grantRequest.header": "Petición de acceso",
-  "grantRequests.empty": "No se han encontrado peticiones de datos",
-  "grantRequests.header": "Peticiones de acceso",
   "grantRequest.header.data_structure": "Estructura",
   "grantRequest.header.path": "Ruta",
+  "grantRequest.header.status": "Estado",
   "grantRequest.header.updated_at": "Actualizado",
   "grantRequest.header.user": "Usuario",
-  "grantRequest.header.status": "Estado",
-  "grantRequests.header.me": "Mis peticiones de acceso",
+  "grantRequest.header": "Petición de acceso",
+  "grantRequestApproval.form.approve": "Aprobar petición de acceso",
+  "grantRequestApproval.form.comments.label": "Comentarios",
+  "grantRequestApproval.form.comments.placeholder": "Comentarios",
+  "grantRequestApproval.form.reject": "Rechazar petición de acceso",
+  "grantRequestApproval.form.role.label": "Rol de aprobación",
+  "grantRequestApproval.form.role.placeholder": "Rol",
+  "grantRequests.empty": "No se han encontrado peticiones de datos",
   "grantRequests.filters": "Filtros",
-  "grantRequests.subheader": "Peticiones de acceso pendientes de aprobación",
+  "grantRequests.header.approve": "Aprobar peticiones de acceso",
+  "grantRequests.header.me": "Mis peticiones de acceso",
+  "grantRequests.header": "Peticiones de acceso",
+  "grantRequests.subheader.approve":
+    "Peticiones de acceso pendientes de aprobación",
   "grantRequests.subheader.me": "Peticiones de acceso demandadas por mí",
+  "grantRequests.subheader": "Peticiones de acceso pendientes de aprobación",
   "grants.actions.download.popup": "Seleccione un acceso",
   "grants.actions.download.tooltip": "Descargar a CSV",
   "grants.header": "Accesos",
@@ -165,6 +176,7 @@ export default {
   "structure.grant.request_grant": "Solicitar acceso",
   "structure.grant.requested_grant": "Solicitud pendiente",
   "structure.grant.cart": "Accesos a solicitar",
+  "structure.grant.cart.checkout": "Checkout",
   "structure.grant.cart.template": "Información de solicitud",
   "structure.grant.cart.template.placeholder": "Seleccione tipo de solicitud",
   "structure.grant.cart.filters": "Filtros para la estructura",

package/src/reducers/__tests__/creatingGrantRequestApproval.spec.js

@@ -0,0 +1,33 @@
+import { createGrantRequestApproval } from "../../routines";
+import { creatingGrantRequestApproval } from "../creatingGrantRequestApproval";
+
+const fooState = { foo: "bar" };
+const initialState = false;
+
+describe("reducers: creatingGrantRequestApproval", () => {
+  it("should provide the initial state", () => {
+    expect(creatingGrantRequestApproval(undefined, {})).toBe(initialState);
+  });
+
+  it("should handle the createGrantRequestApproval.TRIGGER action", () => {
+    expect(
+      creatingGrantRequestApproval(fooState, {
+        type: createGrantRequestApproval.TRIGGER,
+      })
+    ).toBe(true);
+  });
+
+  it("should handle the createGrantRequestApproval.FULFILL action", () => {
+    expect(
+      creatingGrantRequestApproval(fooState, {
+        type: createGrantRequestApproval.FULFILL,
+      })
+    ).toBe(initialState);
+  });
+
+  it("should ignore unknown actions", () => {
+    expect(creatingGrantRequestApproval(fooState, { type: "FOO" })).toBe(
+      fooState
+    );
+  });
+});

package/src/reducers/creatingGrantRequestApproval.js

@@ -0,0 +1,16 @@
+import { createGrantRequestApproval } from "../routines";
+
+const initialState = false;
+
+const creatingGrantRequestApproval = (state = initialState, { type }) => {
+  switch (type) {
+    case createGrantRequestApproval.TRIGGER:
+      return true;
+    case createGrantRequestApproval.FULFILL:
+      return initialState;
+    default:
+      return state;
+  }
+};
+
+export { creatingGrantRequestApproval };

package/src/reducers/index.js

@@ -1,5 +1,6 @@
 import { bulkUpdateStructuresLoading } from "./bulkUpdateStructuresLoading";
 import { childrenRelations, parentRelations } from "./structureRelations";
+import { creatingGrantRequestApproval } from "./creatingGrantRequestApproval";
 import { csvGraphDownloading } from "./csvGraphDownloading";
 import { ddMessage } from "./ddMessage";
 import { deletingStructureTags } from "./deletingStructureTags";
@@ -91,6 +92,7 @@ import { grantRequestsQuery } from "./grantRequestsQuery";
 export {
   bulkUpdateStructuresLoading,
   childrenRelations,
+  creatingGrantRequestApproval,
   csvGraphDownloading,
   ddMessage,
   deletingStructureTags,

package/src/reducers/structureRedirect.js

@@ -15,6 +15,7 @@ import {
   uploadStructures,
   doStructureNoteAction,
   checkoutGrantRequest,
+  createGrantRequestApproval,
 } from "../routines";
 
 export const initialState = "";
@@ -67,6 +68,9 @@ export const structureRedirect = (
       const id = _.prop("data.id")(payload);
       return linkTo.PROFILE_GROUP({ id });
     }
+    case createGrantRequestApproval.SUCCESS: {
+      return linkTo.GRANT_REQUEST_APPROVALS();
+    }
     default:
       return state;
   }

package/src/routines.js

@@ -156,3 +156,7 @@ export const removeGrantRequestsQuery = createRoutine(
   "REMOVE_GRANT_REQUESTS_QUERY"
 );
 export const setGrantRequestsQuery = createRoutine("SET_GRANT_REQUESTS_QUERY");
+
+export const createGrantRequestApproval = createRoutine(
+  "CREATE_GRANT_REQUEST_APPROVAL"
+);

package/src/sagas/__tests__/createGrantRequestApproval.spec.js

@@ -0,0 +1,80 @@
+import { compile } from "path-to-regexp";
+import { testSaga } from "redux-saga-test-plan";
+import { apiJsonPost, JSON_OPTS } from "@truedat/core/services/api";
+import {
+  createGrantRequestApprovalRequestSaga,
+  createGrantRequestApprovalSaga,
+} from "../createGrantRequestApproval";
+import { createGrantRequestApproval } from "../../routines";
+import { API_GRANT_REQUEST_APPROVALS } from "../../api";
+
+describe("sagas: createGrantRequestApprovalRequestSaga", () => {
+  it("should invoke createGrantRequestApprovalSaga on createGrantRequestApproval.TRIGGER", () => {
+    expect(() => {
+      testSaga(createGrantRequestApprovalRequestSaga)
+        .next()
+        .takeLatest(
+          createGrantRequestApproval.TRIGGER,
+          createGrantRequestApprovalSaga
+        )
+        .finish()
+        .isDone();
+    }).not.toThrow();
+  });
+
+  it("should throw exception if an unhandled action is received", () => {
+    expect(() => {
+      testSaga(createGrantRequestApprovalRequestSaga)
+        .next()
+        .takeLatest("FOO", createGrantRequestApprovalRequestSaga);
+    }).toThrow();
+  });
+});
+
+describe("sagas: createGrantRequestApprovalSaga", () => {
+  const approval = {
+    body: "approval",
+  };
+  const payload = {
+    grantRequestId: 8,
+    approval,
+  };
+  const request_data = { approval };
+
+  const url = compile(API_GRANT_REQUEST_APPROVALS)({ id: 8 });
+
+  it("should put a success action when a response is returned", () => {
+    expect(() => {
+      testSaga(createGrantRequestApprovalSaga, { payload })
+        .next()
+        .put({ ...createGrantRequestApproval.request(request_data) })
+        .next()
+        .call(apiJsonPost, url, request_data, JSON_OPTS)
+        .next({ data: payload })
+        .put({ ...createGrantRequestApproval.success(payload) })
+        .next()
+        .put(createGrantRequestApproval.fulfill())
+        .next()
+        .isDone();
+    }).not.toThrow();
+  });
+
+  it("should put a failure action when the call returns an error", () => {
+    const message = "Request failed";
+    const error = { message };
+
+    expect(() => {
+      testSaga(createGrantRequestApprovalSaga, { payload })
+        .next()
+        .put({ ...createGrantRequestApproval.request(request_data) })
+        .next()
+        .call(apiJsonPost, url, request_data, JSON_OPTS)
+        .throw(error)
+        .put(createGrantRequestApproval.failure(message))
+        .next()
+        .put(createGrantRequestApproval.fulfill())
+        .next()
+        .isDone();
+    }).not.toThrow();
+  });
+});

package/src/sagas/createGrantRequestApproval.js

@@ -0,0 +1,31 @@
+import { compile } from "path-to-regexp";
+import { call, put, takeLatest } from "redux-saga/effects";
+import { apiJsonPost, JSON_OPTS } from "@truedat/core/services/api";
+import { createGrantRequestApproval } from "../routines";
+import { API_GRANT_REQUEST_APPROVALS } from "../api";
+
+export function* createGrantRequestApprovalSaga({ payload }) {
+  try {
+    const { grantRequestId, approval } = payload;
+    const url = compile(API_GRANT_REQUEST_APPROVALS)({ id: grantRequestId });
+    yield put(createGrantRequestApproval.request({ approval }));
+    const { data } = yield call(apiJsonPost, url, { approval }, JSON_OPTS);
+    yield put(createGrantRequestApproval.success(data));
+  } catch (error) {
+    if (error.response) {
+      const { status, data } = error.response;
+      yield put(createGrantRequestApproval.failure({ status, data }));
+    } else {
+      yield put(createGrantRequestApproval.failure(error.message));
+    }
+  } finally {
+    yield put(createGrantRequestApproval.fulfill());
+  }
+}
+
+export function* createGrantRequestApprovalRequestSaga() {
+  yield takeLatest(
+    createGrantRequestApproval.TRIGGER,
+    createGrantRequestApprovalSaga
+  );
+}

package/src/sagas/index.js

@@ -1,4 +1,5 @@
 import { bulkUpdateStructuresRequestsSaga } from "./bulkUpdateStructures";
+import { createGrantRequestApprovalRequestSaga } from "./createGrantRequestApproval";
 import { createGraphRequestSaga } from "./createGraph";
 import { createProfileGroupRequestSaga } from "./createProfileGroup";
 import { createStructureGraphRequestSaga } from "./createStructureGraph";
@@ -46,6 +47,7 @@ import { operateGrantRequestToCartRequestSaga } from "./operateGrantRequestCart"
 
 export {
   bulkUpdateStructuresRequestsSaga,
+  createGrantRequestApprovalRequestSaga,
   createGraphRequestSaga,
   createProfileGroupRequestSaga,
   createStructureGraphRequestSaga,
@@ -94,6 +96,7 @@ export {
 
 export default [
   bulkUpdateStructuresRequestsSaga(),
+  createGrantRequestApprovalRequestSaga(),
   createGraphRequestSaga(),
   createProfileGroupRequestSaga(),
   createStructureGraphRequestSaga(),

package/src/selectors/__tests__/getGrantRequests.spec.js

@@ -1,4 +1,4 @@
-import { getMyGrantRequests } from "..";
+import { getGrantRequests } from "..";
 
 const grantRequests = [
   { updated_at: "2021-09-20 11:05:58", id: 1 },
@@ -6,12 +6,12 @@ const grantRequests = [
   { updated_at: "2021-10-04 07:25:01", id: 3 },
 ];
 
-describe("selectors: getMyGrantRequests", () => {
+describe("selectors: getGrantRequests", () => {
   const state = {
     grantRequests,
   };
   it("get fields sorted by updated_at", () => {
-    expect(getMyGrantRequests(state)).toEqual([
+    expect(getGrantRequests(state)).toEqual([
       { updated_at: "2021-10-04 07:25:01", id: 3 },
       { updated_at: "2021-09-20 11:05:58", id: 1 },
       { id: 2 },

package/src/selectors/getGrantRequests.js

@@ -1,7 +1,7 @@
 import _ from "lodash/fp";
 import { createSelector } from "reselect";
 
-export const getMyGrantRequests = createSelector(
+export const getGrantRequests = createSelector(
   [_.prop("grantRequests")],
   (grantRequests) => {
     return _.orderBy(

package/src/selectors/getGrantRequestsColumns.js

@@ -66,7 +66,7 @@ export const defaultGrantRequestsTableColumns = [
   {
     name: "user",
     fieldSelector: (grantRequest) => ({
-      user: grantRequest?._embedded?.group?.user,
+      user: grantRequest?._embedded?.group?._embedded?.user,
     }),
     fieldDecorator: UserDecorator,
   },
@@ -107,7 +107,17 @@ export const getMyGrantRequestsColumns = createSelector(
   (grantsRequestsColumns) => {
     return _.flow(
       _.defaultTo(defaultGrantRequestsTableColumns),
-      _.reject((c) => c.name === "user")
+      _.reject({ name: "user" })
+    )(grantsRequestsColumns);
+  }
+);
+
+export const getGrantRequestsApprovalColumns = createSelector(
+  [_.prop("grantRequestsColumns")],
+  (grantsRequestsColumns) => {
+    return _.flow(
+      _.defaultTo(defaultGrantRequestsTableColumns),
+      _.reject({ name: "status" })
     )(grantsRequestsColumns);
   }
 );