@openmrs/esm-stock-management-app 1.0.1-pre.327

package/src/stock-sources/stock-sources.resource.ts

@@ -0,0 +1,80 @@
+import { openmrsFetch } from "@openmrs/esm-framework";
+import { ResourceFilterCriteria, toQueryParams } from "../core/api/api";
+import useSWR from "swr";
+import { PageableResult } from "../core/api/types/PageableResult";
+import { StockSource } from "../core/api/types/stockOperation/StockSource";
+
+export interface StockSourceFilter extends ResourceFilterCriteria {
+  sourceTypeUuid?: string | null;
+}
+
+// getStockSources
+export function useStockSources(filter: StockSourceFilter) {
+  const apiUrl = `ws/rest/v1/stockmanagement/stocksource${toQueryParams(
+    filter
+  )}`;
+
+  const { data, error, isLoading } = useSWR<
+    { data: PageableResult<StockSource> },
+    Error
+  >(apiUrl, openmrsFetch);
+
+  return {
+    items: data?.data || <PageableResult<StockSource>>{},
+    isLoading,
+    isError: error,
+  };
+}
+
+// getStockSource
+export function useStockSource(id: string) {
+  const apiUrl = `ws/rest/v1/stockmanagement/stocksource/${id}`;
+  const { data, error, isLoading } = useSWR<{ data: StockSource }, Error>(
+    apiUrl,
+    openmrsFetch
+  );
+  return {
+    items: data.data ? data.data : [],
+    isLoading,
+    isError: error,
+  };
+}
+
+// deleteStockSources
+export function deleteStockSource(ids: string[]) {
+  let otherIds = ids.reduce((p, c, i) => {
+    if (i === 0) return p;
+    p += (p.length > 0 ? "," : "") + encodeURIComponent(c);
+    return p;
+  }, "");
+  if (otherIds.length > 0) {
+    otherIds = "?ids=" + otherIds;
+  }
+  const apiUrl = `ws/rest/v1/stockmanagement/stocksource/${ids[0]}${otherIds}`;
+  const abortController = new AbortController();
+  return openmrsFetch(apiUrl, {
+    method: "DELETE",
+    headers: {
+      "Content-Type": "application/json",
+    },
+    signal: abortController.signal,
+  });
+}
+
+// createOrUpdateStockSource
+export function createOrUpdateStockSource(item: StockSource) {
+  const isNew = item.uuid != null;
+
+  const apiUrl = `ws/rest/v1/stockmanagement/stocksource${
+    isNew ? "/" + item.uuid : ""
+  }`;
+  const abortController = new AbortController();
+  return openmrsFetch(apiUrl, {
+    method: "POST",
+    headers: {
+      "Content-Type": "application/json",
+    },
+    signal: abortController.signal,
+    body: { ...item, sourceType: item?.sourceType?.uuid },
+  });
+}

package/src/stock-sources/stock-sources.scss

@@ -0,0 +1,220 @@
+@use '@carbon/styles/scss/colors';
+@use '@carbon/styles/scss/spacing';
+@use '@carbon/styles/scss/type';
+@import '~@openmrs/esm-styleguide/src/vars';
+
+.container {
+  background-color: $ui-01;
+}
+
+.headerContainer {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 1rem;
+  background-color: $ui-background;
+}
+
+.headerButtons {
+  display: flex;
+  flex-flow: column;
+}
+
+.heading {
+  font-size: 20px;
+  font-weight: bold;
+}
+
+.filterContainer {
+  :global(.cds--dropdown__wrapper--inline) {
+    gap: 0;
+  }
+
+  :global(.cds--list-box__menu-icon) {
+    height: 1rem;
+  }
+
+  :global(.cds--dropdown--inline) :global(.cds--list-box__field) {
+    min-width: 12rem;
+  }
+}
+
+.tooltip :global(.cds--tooltip__trigger.cds--tooltip__trigger--definition) {
+  border-bottom: none;
+}
+
+.tag {
+  margin: 0.25rem 0;
+}
+
+.backgroundDataFetchingIndicator {
+  align-items: center;
+  display: flex;
+  flex: 1 1 0%;
+  justify-content: center;
+}
+
+.search {
+  max-width: 16rem;
+
+  input {
+    background-color: $ui-02 !important;
+  }
+}
+
+.tableContainer {
+  background-color: $ui-01;
+  margin: 0 spacing.$spacing-05;
+  padding: 0;
+
+  a {
+    text-decoration: none;
+  }
+
+  th {
+    color: colors.$gray-70;
+  }
+
+  :global(.cds--data-table) {
+    background-color: $ui-03;
+  }
+
+  .toolbarContent {
+    height: spacing.$spacing-07;
+    margin-bottom: spacing.$spacing-02;
+  }
+}
+
+.emptyRow {
+  padding: 0 1rem;
+  display: flex;
+  align-items: center;
+}
+
+.stockSourcesTable tr:last-of-type {
+  td {
+    border-bottom: none;
+  }
+}
+
+
+.content {
+  @include type.type-style('heading-compact-02');
+  color: colors.$gray-70;
+  margin-bottom: 0.5rem;
+}
+
+.helper {
+  @include type.type-style('body-compact-01');
+  color: colors.$gray-70;
+}
+
+.separator {
+  @include type.type-style('body-compact-02');
+  color: colors.$gray-70;
+  width: 80%;
+  margin: 1.5rem auto;
+  overflow: hidden;
+  text-align: center;
+
+  &::before,
+  &::after {
+    background-color: $text-03;
+    content: '';
+    display: inline-block;
+    height: 1px;
+    position: relative;
+    vertical-align: middle;
+    width: 50%;
+  }
+
+  &::before {
+    right: 0.5rem;
+    margin-left: -50%;
+  }
+
+  &::after {
+    left: 0.5rem;
+    margin-right: -50%;
+  }
+}
+
+.tileContainer {
+  background-color: $ui-02;
+  border-top: 1px solid $ui-03;
+  padding: 5rem 0;
+}
+
+.tile {
+  margin: auto;
+  width: fit-content;
+}
+
+.tileContent {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.menuItem {
+  max-width: none;
+}
+
+.desktopHeading {
+  h4 {
+    @include type.type-style('heading-compact-02');
+    color: colors.$gray-70;
+  }
+}
+
+.tabletHeading {
+  h4 {
+    @include type.type-style('heading-03');
+    color: colors.$gray-70;
+  }
+}
+
+.desktopHeading,
+.tabletHeading {
+  text-align: left;
+  text-transform: capitalize;
+  margin-bottom: spacing.$spacing-05;
+
+  h4:after {
+    content: '';
+    display: block;
+    width: 2rem;
+    padding-top: 3px;
+    border-bottom: 0.375rem solid var(--brand-03);
+  }
+}
+
+.statusContainer {
+  display: flex;
+  align-items: center;
+
+  svg {
+    margin-right: 0.5rem;
+  }
+}
+
+.visitType {
+  @include type.type-style('heading-compact-02');
+}
+
+.headerBtnContainer {
+  background-color: $ui-background;
+  padding: spacing.$spacing-05;
+  text-align: right;
+}
+
+.addPatientToListBtn {
+  margin-left: spacing.$spacing-05;
+  height: spacing.$spacing-09;
+}
+
+.editIcon {
+  color: $interactive-01;
+  margin-top: 0.5rem;
+  cursor: pointer;
+}

package/src/stock-sources/swr-revalidation.ts

@@ -0,0 +1,7 @@
+import { mutate } from "swr";
+
+export const handleMutate = (url: string) => {
+  mutate((key) => typeof key === "string" && key.startsWith(url), undefined, {
+    revalidate: true,
+  });
+};

package/src/stock-tabs/commodity-tabs.component.tsx

@@ -0,0 +1,43 @@
+import { Tab, TabList, TabPanel, TabPanels, Tabs } from "@carbon/react";
+import React from "react";
+import styles from "./commodity-tabs.scss";
+import StockItems from "../stock-items/stock-items.component";
+import StockSources from "../stock-sources/stock-sources.component";
+import StockUserScopes from "../stock-user-role-scopes/stock-user-role-scopes.component";
+import StockOperations from "../stock-operations/stock-operations-table.component";
+
+const StockCommodityTabs: React.FC = () => {
+  return (
+    <div className={styles.tabContainer}>
+      <Tabs>
+        <TabList contained fullWidth>
+          <Tab>Items</Tab>
+          <Tab>Operations</Tab>
+          <Tab>User Roles</Tab>
+          <Tab>Sources</Tab>
+          {/* <Tab>Locations</Tab> */}
+          {/*<Tab>Reports</Tab>*/}
+        </TabList>
+        <TabPanels>
+          <TabPanel>
+            <StockItems />
+          </TabPanel>
+          <TabPanel>
+            <StockOperations />
+          </TabPanel>
+          <TabPanel>
+            <StockUserScopes />
+          </TabPanel>
+          <TabPanel>
+            <StockSources />
+          </TabPanel>
+          {/* <TabPanel>
+            <StockLocations />
+          </TabPanel> */}
+        </TabPanels>
+      </Tabs>
+    </div>
+  );
+};
+
+export default StockCommodityTabs;

package/src/stock-user-role-scopes/add-stock-user-role-scope-button.component.tsx

@@ -0,0 +1,21 @@
+import { Button } from "@carbon/react";
+import React, { useCallback } from "react";
+import { useTranslation } from "react-i18next";
+import { launchOverlay } from "../core/components/overlay/hook";
+import AddStockUserRoleScope from "./add-stock-user-scope/add-stock-user-role-scope.component";
+
+const AddStockUserRoleScopeActionButton: React.FC = () => {
+  const { t } = useTranslation();
+
+  const handleClick = useCallback(() => {
+    launchOverlay("Add Stock User Role Scope", <AddStockUserRoleScope />);
+  }, []);
+
+  return (
+    <Button onClick={handleClick} size="md" kind="primary">
+      {t("stockmanagement.addnewuserrolescope", "Add New User Role Scope")}
+    </Button>
+  );
+};
+
+export default AddStockUserRoleScopeActionButton;