fix(frontend): update fiches service-public view (#361)

* fix(frontend): update fiches service-public view * fix: review
SocialGouv · Mar 23, 2021 · 7a54a73 · 7a54a73
1 parent 56f41bb
commit 7a54a73
Show file tree

Hide file tree

Showing 9 changed files with 123 additions and 30 deletions.
diff --git a/targets/frontend/src/components/fiches-sp/addFicheForm.js b/targets/frontend/src/components/fiches-sp/addFicheForm.js
@@ -90,6 +90,7 @@ export function AddFicheSpForm({ onAdd }) {
                 <Button
                   size="small"
                   variant="secondary"
+                  outline
                   type="button"
                   sx={{ flex: "0 0 auto", ml: "xxlarge" }}
                   onClick={() => append({ id: "" })}
@@ -108,7 +109,7 @@ export function AddFicheSpForm({ onAdd }) {
       })}
       <Box>
         <Button
-          variant="secondary"
+          variant="primary"
           disabled={Object.keys(errors).length > 0 || !isDirty}
         >
           {isDirty && Object.keys(errors).length === 0 && (

diff --git a/targets/frontend/src/components/fiches-sp/fichesSpContainer.js b/targets/frontend/src/components/fiches-sp/fichesSpContainer.js
@@ -71,10 +71,10 @@ export function FichesServicePublicContainer() {
 
 const getFicheServicePublicId = `
 query getServicePublicId($offset: Int = 0, $limit: Int = 50) {
-  ficheIds: service_public_contents( offset: $offset, limit: $limit, order_by: [{status: desc, id: asc}]) {
-   id, status
+  ficheIds: v1_fiches_sp( offset: $offset, limit: $limit) {
+   id, cdtn_id, status, is_available, is_published
   }
-  aggs:service_public_contents_aggregate {
+  aggs:v1_fiches_sp_aggregate {
     aggregate{
       count
     }

diff --git a/targets/frontend/src/components/fiches-sp/list.js b/targets/frontend/src/components/fiches-sp/list.js
@@ -1,22 +1,29 @@
+/** @jsxImportSource theme-ui */
+
+import PropTypes from "prop-types";
 import { useContext } from "react";
+import { IoMdCheckmarkCircleOutline } from "react-icons/io";
 import { SelectionContext } from "src/pages/contenus/fiches-sp";
-import { Label } from "theme-ui";
-
-import { Li, List } from "../list";
+import { css, Label, Text } from "theme-ui";
 
 export function ServicPublicList({ items }) {
   return (
-    <List>
+    <Table>
+      <thead>
+        <tr>
+          <Th sx={{ width: "2.5rem" }} />
+          <Th align="left">id</Th>
+          <Th align="left">status</Th>
+        </tr>
+      </thead>
       {items.map((item) => (
-        <Li key={item.id}>
-          <ServicePublicItem item={item} />
-        </Li>
+        <ServicePublicItemRow key={item.id} item={item} />
       ))}
-    </List>
+    </Table>
   );
 }
 
-function ServicePublicItem({ item }) {
+function ServicePublicItemRow({ item }) {
   const [selectedItems, setSelectedItems] = useContext(SelectionContext);
 
   function updateSelection(event) {
@@ -27,13 +34,89 @@ function ServicePublicItem({ item }) {
     }
   }
   return (
-    <Label>
-      <input
-        type="checkbox"
-        defaultChecked={selectedItems.includes(item.id)}
-        onChange={updateSelection}
-      />
-      {item.id} ({item.status})
-    </Label>
+    <Tr>
+      <Td>
+        <input
+          type="checkbox"
+          defaultChecked={selectedItems.includes(item.id)}
+          onChange={updateSelection}
+          id={`row-${item.id}`}
+        />
+      </Td>
+      <Td>
+        <Label htmlFor={`row-${item.id}`} sx={{ cursor: "pointer" }}>
+          {item.id}
+        </Label>
+      </Td>
+      <Td>{getStatus(item)}</Td>
+    </Tr>
   );
 }
+
+function getStatus({ status, cdtn_id, is_available, is_published }) {
+  if (status === "unknow") {
+    return <Text sx={{ color: "danger" }}>fiche inconnue</Text>;
+  }
+  if (cdtn_id === null) {
+    if (status === "unknown") {
+      return <Text sx={{ color: "critical" }}>la fiche n’existe pas</Text>;
+    }
+    return <Text sx={{ color: "muted" }}>En attente de traitement</Text>;
+  }
+  if (is_available) {
+    if (is_published) {
+      return (
+        <Text sx={{ color: "positive" }}>
+          <IoMdCheckmarkCircleOutline
+            aria-label="la fiche est disponible"
+            title="La fiche est disponible"
+          />
+        </Text>
+      );
+    }
+    return <Text sx={{ color: "muted" }}>dépubliée</Text>;
+  }
+  return <Text sx={{ color: "critical" }}>supprimée </Text>;
+}
+
+const Table = (props) => <table css={styles.table} {...props} />;
+const Tr = (props) => <tr css={styles.tr} {...props} />;
+const cellPropTypes = {
+  align: PropTypes.oneOf(["left", "right", "center"]),
+};
+const Th = ({ align = "left", ...props }) => (
+  <th css={styles.th} sx={{ textAlign: align }} {...props} />
+);
+Th.propTypes = cellPropTypes;
+const Td = ({ align = "left", ...props }) => (
+  <td css={styles.td} {...props} sx={{ textAlign: align }} />
+);
+Td.propTypes = cellPropTypes;
+
+const styles = {
+  table: css({
+    borderCollapse: "collapse",
+    borderRadius: "small",
+    overflow: "hidden",
+    width: "100%",
+  }),
+  td: css({
+    fontWeight: 300,
+    px: "xsmall",
+    py: "xxsmall",
+    "tr:nth-of-type(even) &": {
+      bg: "highlight",
+    },
+  }),
+  th: css({
+    borderBottom: "1px solid",
+    fontSize: "medium",
+    // bg: "info",
+    // color: "white",
+    fontWeight: "semibold",
+
+    px: "xsmall",
+
+    py: "xsmall",
+  }),
+};
diff --git a/targets/hasura/metadata/tables.yaml b/targets/hasura/metadata/tables.yaml
@@ -514,6 +514,9 @@
       - created_at
       filter: {}
       check: {}
+- table:
+    schema: v1
+    name: fiches_sp
 - table:
     schema: v1
     name: fiches_travail_data_alerts

diff --git a/targets/hasura/migrations/1616080671217_create_fichesp_view/down.sql b/targets/hasura/migrations/1616080671217_create_fichesp_view/down.sql
@@ -0,0 +1 @@
+DROP VIEW IF EXISTS "v1"."fiches_sp";
diff --git a/targets/hasura/migrations/1616080671217_create_fichesp_view/up.sql b/targets/hasura/migrations/1616080671217_create_fichesp_view/up.sql
@@ -0,0 +1,11 @@
+CREATE OR REPLACE VIEW"v1"."fiches_sp" AS
+SELECT
+    fichesp.id,
+    fichesp.status,
+    COALESCE(documents.is_published AND documents.is_available, false)  as online_status,
+    documents.cdtn_id,
+    documents.is_published,
+    documents.is_available
+FROM service_public_contents as "fichesp"
+LEFT JOIN documents on fichesp.id = documents.initial_id
+ORDER BY online_status ASC, TRIM(leading 'F' FROM id)::INTEGER ASC;
diff --git a/targets/ingester/data/.gitkeep b/targets/ingester/data/.gitkeep
diff --git a/targets/ingester/package.json b/targets/ingester/package.json
@@ -53,6 +53,7 @@
     "build": "ncc build ./src/cli.js -o ./dist -s",
     "cli": "node --enable-source-maps --unhandled-rejections=strict dist/index.js",
     "cli:dev": "HASURA_GRAPHQL_ENDPOINT=http://localhost:8080/v1/graphql HASURA_GRAPHQL_ADMIN_SECRET=admin1 node -r esm src/cli.js",
+    "cli:prod": "HASURA_GRAPHQL_ENDPOINT=http://localhost:8080/v1/graphql HASURA_GRAPHQL_ADMIN_SECRET=admin1 node --enable-source-maps --unhandled-rejections=strict dist/index.js",
     "lint": "eslint src/**/*.js",
     "types": "tsc",
     "test": "jest --passWithNoTests"

diff --git a/targets/ingester/src/transform/fichesServicePublic/index.js b/targets/ingester/src/transform/fichesServicePublic/index.js
@@ -64,8 +64,8 @@ export default async function getFichesServicePublic(pkgName) {
     throw new Error(`error while retrieving ingester packages version`);
   }
 
-  const includeFicheId = results.data?.ficheIds.map(({ id }) => id) || [];
-
+  const includeFicheId =
+    (results.data || { ficheIds: [] }).ficheIds.map(({ id }) => id) || [];
   const listFicheVdd = filter(includeFicheId, ficheVddIndex);
 
   const unknonwFiches = includeFicheId.filter((id) =>
@@ -75,13 +75,6 @@ export default async function getFichesServicePublic(pkgName) {
     .mutation(updateStatusMutation, { ids: unknonwFiches, status: "unknown" })
     .toPromise();
 
-  const knonwFiches = includeFicheId.filter((id) =>
-    listFicheVdd.some((fiche) => fiche.id === id)
-  );
-  await client
-    .mutation(updateStatusMutation, { ids: knonwFiches, status: "done" })
-    .toPromise();
-
   const fichesIdFromContrib = contributions.flatMap(({ answers }) => {
     const url = extractMdxContentUrl(answers.generic.markdown);
     if (url) {