From f1d1951c4b3159bb10132e7b40b2e8ac95233230 Mon Sep 17 00:00:00 2001 From: James Cahill Date: Sun, 25 Jun 2023 11:50:15 +0100 Subject: [PATCH] (lint): Run prettier on team files --- src/components/team/creditEntry.tsx | 30 ++++---- src/components/team/teamBadges.tsx | 7 +- src/pages/team.tsx | 106 ++++++++++++++++++---------- 3 files changed, 91 insertions(+), 52 deletions(-) diff --git a/src/components/team/creditEntry.tsx b/src/components/team/creditEntry.tsx index a6170b39..0f0f8d15 100644 --- a/src/components/team/creditEntry.tsx +++ b/src/components/team/creditEntry.tsx @@ -11,7 +11,12 @@ import { GatsbyImage, getImage } from "gatsby-plugin-image"; import TeamTag from "../../types/teamTag"; import { Theme } from "@mui/material"; -type CreditEntryArgs = { member: TeamMemberNode; data: Queries.TeamPageDataQuery; tags: TeamTag[], muiTheme: Theme }; +type CreditEntryArgs = { + member: TeamMemberNode; + data: Queries.TeamPageDataQuery; + tags: TeamTag[]; + muiTheme: Theme; +}; interface CreditEntryState { showModal: boolean; @@ -64,18 +69,19 @@ export class CreditEntry extends React.Component {/* Important: make sure the key prop is set to avoid React displaying the wrong component instance! */} - { - // Use this.props.tags (TeamTag[]) to look up the TeamTag instance for this tag. - // This instance includes the tag colour. - // All in-use tags are registered in team.tsx. - // Therefore, we can notNull the find response. - const tag = this.props.tags.find(t => t.name == tagName)! + { + // Use this.props.tags (TeamTag[]) to look up the TeamTag instance for this tag. + // This instance includes the tag colour. + // All in-use tags are registered in team.tsx. + // Therefore, we can notNull the find response. + const tag = this.props.tags.find(t => t.name == tagName)!; - return tag; - }) - } muiTheme={this.props.muiTheme} /> + return tag; + })} + muiTheme={this.props.muiTheme} + /> diff --git a/src/components/team/teamBadges.tsx b/src/components/team/teamBadges.tsx index 8782cc48..a418164c 100644 --- a/src/components/team/teamBadges.tsx +++ b/src/components/team/teamBadges.tsx @@ -7,7 +7,12 @@ import capitalizeWords from "../../capitalizeWords"; const ConstructBadge = (tag: TeamTag): React.JSX.Element => { return ( - + ); }; diff --git a/src/pages/team.tsx b/src/pages/team.tsx index f26264b6..d0701870 100644 --- a/src/pages/team.tsx +++ b/src/pages/team.tsx @@ -5,11 +5,17 @@ import { graphql, PageProps } from "gatsby"; import "bootstrap/dist/css/bootstrap.min.css"; import { CreditEntry } from "../components/team/creditEntry"; import { TeamMemberNode } from "../types/teamMemberNode"; -import { Chip, createTheme, SimplePaletteColorOptions, TextField, Theme, ThemeProvider } from "@mui/material"; -import AddIcon from '@mui/icons-material/Add'; - -import update from 'immutability-helper'; - +import { + Chip, + createTheme, + SimplePaletteColorOptions, + TextField, + Theme, + ThemeProvider, +} from "@mui/material"; +import AddIcon from "@mui/icons-material/Add"; + +import update from "immutability-helper"; import { TeamTagColourNode } from "../types/teamTagColourNode"; import TeamTag from "../types/teamTag"; @@ -38,7 +44,7 @@ export default class TeamPage extends React.PureComponent< this.state = { isReady: false, searchQuery: "", - filterChip: [] + filterChip: [], }; } @@ -71,18 +77,25 @@ export default class TeamPage extends React.PureComponent< // Has not been registered! Let's register it. this.registerTag(tag!); } - }) + }); console.log(`Adding entry for '${member.name}'`); - this.entries.push(); + this.entries.push( + + ); }); // Add an entry to filterChip for each discovered tag. this.discoveredTags.forEach(tag => { this.state.filterChip.push({ tag, - enabled: true - }) - }) + enabled: true, + }); + }); // Evertything is done! Update the state. this.setState({ isReady: true }); @@ -92,9 +105,9 @@ export default class TeamPage extends React.PureComponent< /** * Register the current tag. - * + * * This function retrieves the tag colour from the GraphQL response. - * + * * @param name tag name */ registerTag(name: string) { @@ -109,9 +122,10 @@ export default class TeamPage extends React.PureComponent< // 2. Find the tag colour from the GraphQL query response, // Falling back to the default colour if a match is not found. - const colour = this.props.data.allTeamTagColourYaml.nodes.find( - (entry: TeamTagColourNode) => entry.tag == name - )?.colour || defaultTagColour; + const colour = + this.props.data.allTeamTagColourYaml.nodes.find( + (entry: TeamTagColourNode) => entry.tag == name + )?.colour || defaultTagColour; // 3. Create a new TeamTag instance for this tag. // colour will never be null as we return defaultTagColour instead of null. @@ -127,11 +141,11 @@ export default class TeamPage extends React.PureComponent< /** * Check if the given tag name is registered in the list of tags. - * + * * @param tagName tag name to check */ isTagRegistered(tagName: string) { - return this.discoveredTags.find(entry => entry.name == tagName) == undefined + return this.discoveredTags.find(entry => entry.name == tagName) == undefined; } // #endregion @@ -153,14 +167,13 @@ export default class TeamPage extends React.PureComponent< main: tag.colour, light: tag.colour, dark: tag.colour, - contrastText: "rgba(255,255,255,1)" - } + contrastText: "rgba(255,255,255,1)", + }; this.muiPaletteOptions[tag.paletteName] = colourOptions; // Recreate the palette - this.muiTheme = createTheme({ palette: this.muiPaletteOptions }) - + this.muiTheme = createTheme({ palette: this.muiPaletteOptions }); } } @@ -168,23 +181,22 @@ export default class TeamPage extends React.PureComponent< //console.log("CHIP DISABLE"); //debugger; - // entry.enabled = xyz does not update the state - const entryIndex = this.state.filterChip.indexOf(entry) + const entryIndex = this.state.filterChip.indexOf(entry); - console.log(this.state) + console.log(this.state); this.setState({ - filterChip: update(this.state.filterChip, { [entryIndex]: { enabled: { $set: !this.state.filterChip[entryIndex].enabled } } }) - }) - - + filterChip: update(this.state.filterChip, { + [entryIndex]: { enabled: { $set: !this.state.filterChip[entryIndex].enabled } }, + }), + }); } render(): React.ReactNode { if (!this.state["isReady"]) { return
Preparing...
; } else { - console.log(this.muiPaletteOptions) + console.log(this.muiPaletteOptions); return ( {/** @@ -203,19 +215,35 @@ export default class TeamPage extends React.PureComponent< */} {this.state.filterChip.map(entry => { if (entry.enabled) { - return - this.handleChipClick(event, entry)} label={capitalizeWords(entry.tag.name)} color={entry.tag.paletteName} size="small" sx={{ fontWeight: "bold" }} /> - + return ( + + this.handleChipClick(event, entry)} + label={capitalizeWords(entry.tag.name)} + color={entry.tag.paletteName} + size="small" + sx={{ fontWeight: "bold" }} + /> + + ); } else { - return - } onClick={(event: any) => this.handleChipClick(event, entry)} label={capitalizeWords(entry.tag.name)} color={entry.tag.paletteName} size="small" sx={{ fontWeight: "bold" }} /> - + return ( + + } + onClick={(event: any) => this.handleChipClick(event, entry)} + label={capitalizeWords(entry.tag.name)} + color={entry.tag.paletteName} + size="small" + sx={{ fontWeight: "bold" }} + /> + + ); } })} - { - teamEntryFilter(this.entries, this.state.searchQuery, this.state.filterChip) - } + {teamEntryFilter(this.entries, this.state.searchQuery, this.state.filterChip)} ); }