landscape: allow autofocusing ship select

Fixes #3804

pkg/interface/src/views/components/DropdownSearch.tsx

@@ -22,6 +22,7 @@ interface RenderChoiceProps<C> {
 }
 
 interface DropdownSearchProps<C> {
+  autoFocus?: boolean;
   label?: string;
   id: string;
   // check if entry is exact match
@@ -51,7 +52,7 @@ interface DropdownSearchProps<C> {
 
 export function DropdownSearch<C>(props: DropdownSearchProps<C>) {
   const textarea = useRef<HTMLTextAreaElement>();
-  const { candidates, getKey, caption } = props;
+  const { candidates, getKey, caption, autoFocus } = props;
 
   const [query, setQuery] = useState("");
 
@@ -127,6 +128,7 @@ export function DropdownSearch<C>(props: DropdownSearchProps<C>) {
           value={query}
           autocomplete="off"
           placeholder={props.placeholder || ""}
+          autoFocus={autoFocus}
         />
       )}
       {dropdown.length !== 0 && query.length !== 0 && (

pkg/interface/src/views/components/ShipSearch.tsx

@@ -12,6 +12,7 @@ import { Rolodex, Groups } from "~/types";
 import { HoverBox } from "./HoverBox";
 
 interface InviteSearchProps {
+  autoFocus?: boolean;
   disabled?: boolean;
   label?: string;
   caption?: string;
@@ -138,6 +139,7 @@ export function ShipSearch(props: InviteSearchProps) {
         renderChoice={({ candidate, onRemove }) => null}
         value={undefined}
         error={error}
+        autoFocus={props.autoFocus}
       />
       <Row minHeight="34px" flexWrap="wrap">
         {value.map((s) => (

pkg/interface/src/views/landscape/components/InvitePopover.tsx

@@ -110,6 +110,7 @@ export function InvitePopover(props: InvitePopoverProps) {
                     id="ships"
                     label=""
                     maxLength={props.workspace.type === 'home' ? 1 : undefined}
+                    autoFocus
                   />
                   <FormError message="Failed to invite" />
                   {/* <ChipInput