All files / src/components/views/Schemas SchemaDetail.stories.tsx

0% Statements 0/14
0% Branches 0/6
0% Functions 0/5
0% Lines 0/14

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86                                                                                                                                                                           
import React from "react";
import { storiesOf } from "@storybook/react";
import { Box, Flash } from "rimble-ui";
import { EXAMPLE_SCHEMAS } from "vc-schema-tools";
import { SchemaDetail } from "./SchemaDetail";
import { jsonSchemaToSchemaInput } from "./utils";
import { SchemaDataInput } from "./types";
import { IdentityThemeProvider } from "../../../themes/IdentityTheme";
import { SertoUiProvider } from "../../../context/SertoUiProvider";
import { createMockApiRequest } from "../../../utils/helpers";
import { Identifier } from "../../../types";
 
const DEFAULT_SCHEMA = "ContentPublishCredential";
const IDENTIFIERS: Identifier[] = [
  {
    did: "did:ethr:rinkeby:0xcfa8829812f1b4fe09b27cacf7d36e4d1b5dce76",
    provider: "did:ethr:rinkeby",
    alias: "Admin",
  },
  {
    did: "did:ethr:rinkeby:0x88298d36e4d1b5dce76cf9b27cacf7a12f1b4fe0",
    provider: "did:ethr:rinkeby",
    alias: "Another User",
  },
];
 
const SchemaDetailStory = () => {
  const [schemaKey, setSchemaKey] = React.useState<string>(DEFAULT_SCHEMA);
 
  let schemaData: SchemaDataInput | undefined;
  let error: string | undefined;
  try {
    schemaData = jsonSchemaToSchemaInput(EXAMPLE_SCHEMAS[schemaKey]);
  } catch (err) {
    console.error("Failed to generate schema input from schema:", err);
    error = err.message || JSON.stringify(err);
  }
 
  return (
    <IdentityThemeProvider>
      <Box mb={3}>
        <select value={schemaKey} onChange={(event: any) => setSchemaKey(event.target.value)}>
          {Object.keys(EXAMPLE_SCHEMAS).map((key) => (
            <option key={key} value={key}>
              {key}
            </option>
          ))}
        </select>
      </Box>
 
      <Box key={schemaKey}>
        {schemaData && <SchemaDetail schema={schemaData} />}
        {error && <Flash variant="danger">Error: {error}</Flash>}
      </Box>
    </IdentityThemeProvider>
  );
};
 
storiesOf("Schemas", module)
  .add("SchemaDetail", SchemaDetailStory)
  .add("SchemaDetail (saveable)", () => {
    return (
      <SertoUiProvider
        context={{
          schemasService: {
            isAuthenticated: true,
          },
        }}
      >
        <SchemaDetailStory />
      </SertoUiProvider>
    );
  })
  .add("SchemaDetail (VC issuable)", () => {
    return (
      <SertoUiProvider
        context={{
          userDids: IDENTIFIERS,
          issueVc: createMockApiRequest(),
        }}
      >
        <SchemaDetailStory />
      </SertoUiProvider>
    );
  });