diff --git a/frontend/packages/client/src/components/Community/CommunityEditorDetails.js b/frontend/packages/client/src/components/Community/CommunityEditorDetails.js index 49a3ed9b9..be8cd2388 100644 --- a/frontend/packages/client/src/components/Community/CommunityEditorDetails.js +++ b/frontend/packages/client/src/components/Community/CommunityEditorDetails.js @@ -1,4 +1,4 @@ -import React, { useState, useEffect } from 'react'; +import React, { useState, useEffect, useRef } from 'react'; import { Bin, ValidCheckMark, InvalidCheckMark } from 'components/Svg'; import { WrapperResponsive, Loader, AddButton } from 'components'; import { useCommunityUsers } from 'hooks'; @@ -23,8 +23,17 @@ export const CommunityUsersForm = ({ submitComponent, validateEachAddress = false, onClearField = () => {}, + autoFocusOnLoad = false, } = {}) => { const canDeleteAddress = addrList.length > 1; + + const refOnFirstInput = useRef(); + + useEffect(() => { + if (refOnFirstInput.current) { + refOnFirstInput.current.focus(); + } + }, [refOnFirstInput]); return (
@@ -80,6 +89,11 @@ export const CommunityUsersForm = ({ width: '100%', ...(isInvalid ? {} : undefined), }} + ref={ + addrList.length === 1 && addr === '' && autoFocusOnLoad + ? refOnFirstInput + : undefined + } />
onAdminAddressChange(index, '')} + autoFocusOnLoad={true} /> onAuthorAddressChange(index, '')} + autoFocusOnLoad={false} />