Add accessibility settings where you can disable keyboard shortcuts (#2157)

An accessibility requirement dictates that our custom shortcut system must be allowed to be disabled. A new accessibility settings page has been added to the user profile, similar to the theme settings. It is persisted in local storage.

Co-authored-by: Eduard Heimbuch <eduard.heimbuch@cloudogu.com>

scm-ui/ui-components/src/__snapshots__/storyshots.test.ts.snap

@@ -1619,6 +1619,16 @@ exports[`Storyshots Footer Default 1`] = `
               footer.user.theme
             </a>
           </li>
+          <li>
+            <a
+              className=""
+              data-testid="footer-user-accessibility"
+              href="/me/settings/accessibility"
+              onClick={[Function]}
+            >
+              footer.user.accessibility
+            </a>
+          </li>
         </ul>
       </section>
       <section
@@ -1776,6 +1786,16 @@ exports[`Storyshots Footer Full 1`] = `
               footer.user.theme
             </a>
           </li>
+          <li>
+            <a
+              className=""
+              data-testid="footer-user-accessibility"
+              href="/me/settings/accessibility"
+              onClick={[Function]}
+            >
+              footer.user.accessibility
+            </a>
+          </li>
           <li>
             <a
               className=""
@@ -1972,6 +1992,16 @@ exports[`Storyshots Footer With Avatar 1`] = `
               footer.user.theme
             </a>
           </li>
+          <li>
+            <a
+              className=""
+              data-testid="footer-user-accessibility"
+              href="/me/settings/accessibility"
+              onClick={[Function]}
+            >
+              footer.user.accessibility
+            </a>
+          </li>
         </ul>
       </section>
       <section
@@ -2121,6 +2151,16 @@ exports[`Storyshots Footer With Plugin Links 1`] = `
               footer.user.theme
             </a>
           </li>
+          <li>
+            <a
+              className=""
+              data-testid="footer-user-accessibility"
+              href="/me/settings/accessibility"
+              onClick={[Function]}
+            >
+              footer.user.accessibility
+            </a>
+          </li>
           <li>
             <a
               className=""

scm-ui/ui-components/src/layout/Footer.tsx

@@ -101,6 +101,11 @@ const Footer: FC<Props> = ({ me, version, links }) => {
             <FooterSection title={meSectionTile}>
               <NavLink to="/me" label={t("footer.user.profile")} testId="footer-user-profile" />
               <NavLink to="/me/settings/theme" label={t("footer.user.theme")} testId="footer-user-theme" />
+              <NavLink
+                to="/me/settings/accessibility"
+                label={t("footer.user.accessibility")}
+                testId="footer-user-accessibility"
+              />
               {me?._links?.password && (
                 <NavLink to="/me/settings/password" label={t("profile.changePasswordNavLink")} />
               )}