diff --git a/editor.planx.uk/src/pages/Team.tsx b/editor.planx.uk/src/pages/Team.tsx index ad0c8b9d0b..0e9a39751c 100644 --- a/editor.planx.uk/src/pages/Team.tsx +++ b/editor.planx.uk/src/pages/Team.tsx @@ -183,6 +183,7 @@ const FlowItem: React.FC = ({ const duplicateFlowName = flows?.find( (flow: any) => flow.slug === newSlug, ); + console.log({ duplicateFlowName }); if (!duplicateFlowName) { await client.mutate({ mutation: gql` @@ -258,59 +259,57 @@ const FlowItem: React.FC = ({ }; const GetStarted: React.FC<{ flows: FlowSummary[] }> = ({ flows }) => ( - ({ - mt: 4, - backgroundColor: theme.palette.background.paper, - borderRadius: "8px", - display: "flex", - flexDirection: "column", + ({ + mt: 4, + backgroundColor: theme.palette.background.paper, + borderRadius: "8px", + display: "flex", + flexDirection: "column", alignItems: "center", - gap: 2, - padding: 2 - })}> - No services found - Get started by creating your first service - + gap: 2, + padding: 2, + })} + > + No services found + Get started by creating your first service + -) +); const AddFlowButton: React.FC<{ flows: FlowSummary[] }> = ({ flows }) => { const { navigate } = useNavigation(); - const { teamId, createFlow, teamSlug } = useStore() + const { teamId, createFlow, teamSlug } = useStore(); const addFlow = async () => { const newFlowName = prompt("Service name"); if (!newFlowName) return; const newFlowSlug = slugify(newFlowName); - const duplicateFlowName = flows?.find( - (flow) => flow.slug === newFlowSlug, - ); + const duplicateFlowName = flows?.find((flow) => flow.slug === newFlowSlug); if (duplicateFlowName) { alert( `The flow "${newFlowName}" already exists. Enter a unique flow name to continue`, ); + return; } const newId = await createFlow(teamId, newFlowSlug, newFlowName); navigate(`/${teamSlug}/${newId}`); - } + }; - return( - - Add a new service - - ) -} + return Add a new service; +}; const Team: React.FC = () => { - const [{ id: teamId, slug }, canUserEditTeam, getFlows] = useStore((state) => [state.getTeam(), state.canUserEditTeam, state.getFlows ]); + const [{ id: teamId, slug }, canUserEditTeam, getFlows] = useStore( + (state) => [state.getTeam(), state.canUserEditTeam, state.getFlows], + ); const [flows, setFlows] = useState(null); const fetchFlows = useCallback(() => { - getFlows(teamId) - .then((flows) => { + getFlows(teamId).then((flows) => { // Copy the array and sort by most recently edited desc using last associated operation.createdAt, not flow.updatedAt const sortedFlows = flows.toSorted((a, b) => b.operations[0]["createdAt"].localeCompare( @@ -325,7 +324,7 @@ const Team: React.FC = () => { fetchFlows(); }, [fetchFlows]); - const teamHasFlows = flows && Boolean(flows.length) + const teamHasFlows = flows && Boolean(flows.length); const showAddFlowButton = teamHasFlows && canUserEditTeam(slug); return ( @@ -349,15 +348,9 @@ const Team: React.FC = () => { Services - {canUserEditTeam(slug) ? ( - - ) : ( - - )} + {canUserEditTeam(slug) ? : } - {showAddFlowButton && ( - - )} + {showAddFlowButton && } {teamHasFlows && ( @@ -373,9 +366,9 @@ const Team: React.FC = () => { }} /> ))} - ) - } - { flows && !flows.length && } + + )} + {flows && !flows.length && } ); };