feat(ui): Make the primary input field get the initial keyboard focus

Do this for all organization, product, repository and ORT run creation
forms, as well as secret creation forms for organization, product and
repository, and additionally to  organization infrastructure service
creation form.

Resolves #890.

While at it, partially resolve also #832 by proving GIT as the default
repository type in the repository creation form.

Signed-off-by: Jyrki Keisala <[email protected]>

Author: Etsija

ui/src/routes/_layout/create-organization.tsx

@@ -101,7 +101,7 @@ const CreateOrganizationPage = () => {
                 <FormItem>
                   <FormLabel>Name</FormLabel>
                   <FormControl>
-                    <Input {...field} />
+                    <Input {...field} autoFocus />
                   </FormControl>
                   <FormDescription>
                     Enter the name of your organization

ui/src/routes/_layout/organizations/$orgId/create-product.tsx

@@ -105,7 +105,7 @@ const CreateProductPage = () => {
               render={({ field }) => (
                 <FormItem>
                   <FormLabel>Name</FormLabel>
-                  <FormControl>
+                  <FormControl autoFocus>
                     <Input {...field} />
                   </FormControl>
                   <FormDescription>

ui/src/routes/_layout/organizations/$orgId/infrastructure-services/create.tsx

@@ -140,7 +140,7 @@ const CreateInfrastructureServicePage = () => {
               render={({ field }) => (
                 <FormItem>
                   <FormLabel>Name</FormLabel>
-                  <FormControl>
+                  <FormControl autoFocus>
                     <Input {...field} />
                   </FormControl>
                   <FormDescription>

ui/src/routes/_layout/organizations/$orgId/products/$productId/create-repository.tsx

@@ -90,6 +90,9 @@ const CreateRepositoryPage = () => {
 
   const form = useForm<z.infer<typeof formSchema>>({
     resolver: zodResolver(formSchema),
+    defaultValues: {
+      type: 'GIT',
+    },
   });
 
   async function onSubmit(values: z.infer<typeof formSchema>) {
@@ -116,7 +119,7 @@ const CreateRepositoryPage = () => {
               render={({ field }) => (
                 <FormItem>
                   <FormLabel>URL</FormLabel>
-                  <FormControl>
+                  <FormControl autoFocus>
                     <Input {...field} />
                   </FormControl>
                   <FormDescription>URL of the repository</FormDescription>

ui/src/routes/_layout/organizations/$orgId/products/$productId/repositories/$repoId/create-run.tsx

@@ -545,7 +545,7 @@ const CreateRunPage = () => {
               render={({ field }) => (
                 <FormItem>
                   <FormLabel>Revision</FormLabel>
-                  <FormControl>
+                  <FormControl autoFocus>
                     <Input {...field} />
                   </FormControl>
                   <FormDescription>

ui/src/routes/_layout/organizations/$orgId/products/$productId/repositories/$repoId/secrets/create-secret.tsx

@@ -108,7 +108,7 @@ const CreateRepositorySecretPage = () => {
               render={({ field }) => (
                 <FormItem>
                   <FormLabel>Name</FormLabel>
-                  <FormControl>
+                  <FormControl autoFocus>
                     <Input {...field} />
                   </FormControl>
                   <FormDescription>

ui/src/routes/_layout/organizations/$orgId/products/$productId/secrets/create-secret.tsx

@@ -104,7 +104,7 @@ const CreateProductSecretPage = () => {
               render={({ field }) => (
                 <FormItem>
                   <FormLabel>Name</FormLabel>
-                  <FormControl>
+                  <FormControl autoFocus>
                     <Input {...field} />
                   </FormControl>
                   <FormDescription>

ui/src/routes/_layout/organizations/$orgId/secrets/create-secret.tsx

@@ -106,7 +106,7 @@ const CreateOrganizationSecretPage = () => {
               render={({ field }) => (
                 <FormItem>
                   <FormLabel>Name</FormLabel>
-                  <FormControl>
+                  <FormControl autoFocus>
                     <Input {...field} />
                   </FormControl>
                   <FormDescription>