autoFocus and typo

Author: Tombarr

README.md

@@ -70,7 +70,7 @@ Because developers cannot override the RSK behavior, clicking RSK also calls `hi
 
 [GitHub Pages](https://pages.github.com/) offers free hosting for public open-source repositories. This project uses the [JamesIves/github-pages-deploy-action](https://github.com/JamesIves/github-pages-deploy-action) GitHub Action to build and deploy HTML, CSS, and JS to the `gh-pages` branch.
 
-:warning <u>Production</u>: although it's possible to configure [custom domain names](https://docs.github.com/en/pages/configuring-a-custom-domain-for-your-github-pages-site/about-custom-domains-and-github-pages), "GitHub Pages is not intended for or allowed to be used... either facilitating commercial transactions or providing commercial software" ([see Prohibited Uses](https://docs.github.com/en/pages/getting-started-with-github-pages/about-github-pages#prohibited-uses)). Use GitHub Pages for production applications at your own risk.
+:warning: <u>Production</u>: although it's possible to configure [custom domain names](https://docs.github.com/en/pages/configuring-a-custom-domain-for-your-github-pages-site/about-custom-domains-and-github-pages), "GitHub Pages is not intended for or allowed to be used... either facilitating commercial transactions or providing commercial software" ([see Prohibited Uses](https://docs.github.com/en/pages/getting-started-with-github-pages/about-github-pages#prohibited-uses)). Use GitHub Pages for production applications at your own risk.
 
 ## Developer Program
 

src/components/OptionsMenu.jsx

@@ -1,8 +1,8 @@
 import PropTypes from 'prop-types'
 import './OptionsMenu.css'
 import React, { useEffect, useRef, useState } from 'react'
-import { autoFocusFirstFocusable } from '../utils/focus';
-import { useNavigate } from 'react-router';
+import { autoFocusFirstFocusable } from '../utils/focus'
+import { useNavigate } from 'react-router'
 
 function OptionsMenu({
   visible = false,
@@ -98,6 +98,7 @@ function OptionsMenu({
           React.cloneElement(child, {
             role: 'menuitem',
             tabIndex: index,
+            autoFocus: (index === focusedIndex),
             onClick: () => handleClick(index),
             className: ((index === focusedIndex) ? 'focused' : '')
           })

src/pages/Settings.jsx

@@ -64,6 +64,7 @@ function SettingsComponent() {
         <div>
           <button
             ref={autoFocus}
+            autoFocus
             className='focused'
             role='menuitem'
             onClick={showLanguageSelector}>