I hereby claim:
- I am suzubara on github.
- I am suzubara (https://keybase.io/suzubara) on keybase.
- I have a public key whose fingerprint is F176 DC9C 148D 7609 2125 5A74 6DED 6CDF EF73 06C4
To claim this, I am signing this object:
<!DOCTYPE html> | |
<html> | |
<head> | |
<!-- THIS IS CSS! EDIT AT YOUR OWN RISK! --> | |
<style type="text/css"> | |
header { | |
border:2px solid #000; | |
margin-bottom:20px; |
I hereby claim:
To claim this, I am signing this object:
All of the frontend (browser) code is located in /src
. Here is a brief outline of the directories & how the code is organized:
/src/components
- Low-level React Components that are more about rendering UI than handling application logic, and should typically not be connected to providers directly. Aim for abstract, generic components that can be shared across the application easily, and will usually have corresponding stories
files for viewing in Storybook.
/src/config
- High-level configuration definitions relevant to the whole application (such as routes).
import React from 'react' | |
import { Button, Modal } from '@trussworks/react-uswds' | |
import { connectModal, | |
ModalProps, | |
} from './useModal' | |
interface ConfirmCloseInvestigationModalProps extends ModalProps { | |
casefileNumber: string | |
onConfirm?: () => void |
import React from 'react' | |
import { Button, Modal, useModal } from '@trussworks/react-uswds' | |
import { useGenerator } from '../../containers/customHooks' | |
import { confirmationModalFlow } from '../../containers/generators' | |
const ConfirmCloseInvestigationModal = ({ | |
isOpen, | |
onClose, | |
onConfirm, |
import React from 'react'; | |
import PropTypes from 'prop-types'; | |
import { Formik } from 'formik'; | |
import { TextInput, Label } from '@trussworks/react-uswds'; | |
import ConnectedWizardPage from 'shared/WizardPage'; | |
const NewStep = (props) => { | |
const { title, description, pageList, pageKey } = props; |
import React, { useRef, useState } from 'react' | |
import ReactDOM from 'react-dom' | |
import { | |
Button, | |
Modal, | |
connectModal, | |
ConnectedModalProps, | |
useModal, | |
} from '@trussworks/react-uswds' |
Even though we're using USWDS in this project, there are not actually many icons included by default. Therefore, we've set up react-fontawesome in order to be able to easily include icons from Font Awesome. Specifically, we are using the library implementation described here.
To view icons we have already added, you can view the Basics > Icons page in Storybook.
This document describes methodology & tips for keeping our JS dependencies up-to-date. It assumes we are using classic yarn
over npm
.
Using an automated tool such as Dependabot or Renovatebot can help streamline updates, but there is no substitute for having a reasonable understanding of what our dependencies are, and why we have them.
First of all, it's useful to know the syntax of the package.json
1 and yarn.lock
files. Understanding how to read these can be extremely helpful when trying to determine what version of a dependency is being installed, and to debug potential issues.