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 | import * as React from "react"; import styled from "styled-components"; import { SchemaDataResponse } from "./types"; import { Button } from "rimble-ui"; import { ModalContent, ModalFooter, ModalWithX } from "../../elements/Modals"; import { SchemaDetail } from "./SchemaDetail"; const Wrapper = styled.span` cursor: pointer; &:hover { opacity: 0.75; } `; export interface ViewSchemaButtonProps { schema?: SchemaDataResponse; hideIssueVcInDetail?: boolean; } export const ViewSchemaButton: React.FunctionComponent<ViewSchemaButtonProps> = (props) => { const { schema, hideIssueVcInDetail } = props; const [modalOpen, setModalOpen] = React.useState(false); if (!schema) { return <>{props.children}</>; } return ( <> <Wrapper onClick={() => setModalOpen(true)}> {props.children || <Button.Outline size="small">View</Button.Outline>} </Wrapper> <ModalWithX isOpen={modalOpen} close={() => setModalOpen(false)} minWidth={9} maxWidth={10}> <ModalContent>{modalOpen && <SchemaDetail schema={schema} hideIssueVc={hideIssueVcInDetail} />}</ModalContent> <ModalFooter mt={3}> <Button width="100%" onClick={() => setModalOpen(false)}> Close </Button> </ModalFooter> </ModalWithX> </> ); }; |