message: feat: settings optimizations
diff: @@ -7,6 +7,7 @@ import {
  Grid,
  ListItem,
  Snackbar,
  + Box,
  } from '@material-ui/core';
  import {
  InfoCard,
  @@ -66,13 +67,17 @@ export const SettingsPage = () => {
  <SupportButton>A description of your plugin goes here.</SupportButton>
  </ContentHeader>
  <Grid container spacing={3}>
  - <Grid item xs={6}>
  + <Grid item xs={12} md={3}>
  <InfoCard
  title={
  <>
  Project Credentials
  {/*{authed ? <StatusOK /> : <StatusFailed />} */}
  - <Snackbar autoHideDuration={3000} open={saved}>
  + <Snackbar
  + autoHideDuration={1000}
  + open={saved}
  + onClose={() => setSaved(false)}
  + >
  <Alert severity="success">Credentials saved.</Alert>
  </Snackbar>
  </>
  @@ -84,29 +89,38 @@ export const SettingsPage = () => {
  name="circleci-token"
  label="Token"
  value={token}
  + fullWidth
  variant="outlined"
  - onChange={e => setToken(e.target.value)}
  + onChange={(e) => setToken(e.target.value)}
  />
  </ListItem>
  <ListItem>
  <TextField
  name="circleci-owner"
  + fullWidth
  label="Owner"
  variant="outlined"
  value={owner}
  - onChange={e => setOwner(e.target.value)}
  + onChange={(e) => setOwner(e.target.value)}
  />
  </ListItem>
  <ListItem>
  <TextField
  name="circleci-repo"
  label="Repo"
  + fullWidth
  variant="outlined"
  value={repo}
  - onChange={e => setRepo(e.target.value)}
  + onChange={(e) => setRepo(e.target.value)}
  />
  </ListItem>
  <ListItem>
  + <Box
  + mt={2}
  + display="flex"
  + width="100%"
  + justifyContent="center"
  + >
  <Button
  data-testid="github-auth-button"
  variant="outlined"
  @@ -122,6 +136,7 @@ export const SettingsPage = () => {
  >
  Save credentials
  </Button>
  + </Box>
  </ListItem>
  </List>
  </InfoCard>
  