diff --git a/package.json b/package.json
index 5d9bde2..6478894 100644
--- a/package.json
+++ b/package.json
@@ -10,6 +10,7 @@
"@testing-library/react": "^13.0.0",
"@testing-library/user-event": "^13.2.1",
"@types/jest": "^27.0.1",
+ "@types/lodash": "^4.14.188",
"@types/node": "^16.7.13",
"@types/react": "^18.0.0",
"@types/react-dom": "^18.0.0",
diff --git a/src/App.tsx b/src/App.tsx
index 70ecd6a..a40e362 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,7 +1,8 @@
-import React, {useState, useEffect} from 'react';
+import React, {useState, useEffect, useRef} from 'react';
import db from './db.json';
import {i18nLabels, defaultLang, $lang0, setLang} from './i18n';
import {events, i18nEventNames, presets} from './events';
+import _uniqueId from 'lodash/uniqueId';
import styles from './App.module.sass';
const langs = [
@@ -26,7 +27,7 @@ const f2f = (f: number) => {
const sf = String(f%30)+'f';
const s = f/30|0;
if (s === 0) return sign+sf;
- const ssf = `${s%30}:${sf.padStart(3, '0')}`;
+ const ssf = `${s%60}:${sf.padStart(3, '0')}`;
const m = s/60|0;
if (m === 0) return sign+ssf;
return `${sign}${m}:${ssf.padStart(6, '0')}`;
@@ -45,14 +46,18 @@ const f2s = (f: number) => {
export const RadioGroup = ({name, value: val, values, onChange, ...props}: {
values: (string | [value: string, label: string])[]
-} & React.ComponentProps<'input'>) => <>{values.map(o => {
- const [value, label] = typeof o === 'string' ? [o, o] : o;
- return
-
- {label}
-
;
-})}>;
+} & React.ComponentProps<'input'>) => {
+ const {current: idp} = useRef(_uniqueId('rg-'));
+ return <>{values.map(o => {
+ const [value, label] = typeof o === 'string' ? [o, o] : o;
+ const id = idp+value;
+ return
+
+
+
;
+ })}>;
+};
function App() {
const [selected, setSelected] = useState(
@@ -60,6 +65,7 @@ function App() {
);
const [timeFormat, setTimeFormat] = useState('s');
const f2t = timeFormat === 'f' ? f2f : f2s;
+ const {current: idpEv} = useRef(_uniqueId('ev-'));
const [$lang, set$lang] = useState($lang0);
useEffect(() => setLang($lang), [$lang]);
@@ -115,7 +121,7 @@ function App() {
{L('timeFormat')}
setTimeFormat(e.target.value)} />
@@ -142,11 +148,11 @@ function App() {
Cutscenes
{events.map(id =>
- setSelected(o => ({...o, [id]: e.target.checked}))}
/>
- {eventNames[id]}
+
)}
diff --git a/yarn.lock b/yarn.lock
index 51bd2e0..c502239 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1997,6 +1997,11 @@
resolved "https://registry.yarnpkg.com/@types/json5/-/json5-0.0.29.tgz#ee28707ae94e11d2b827bcbe5270bcea7f3e71ee"
integrity sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ==
+"@types/lodash@^4.14.188":
+ version "4.14.188"
+ resolved "https://registry.yarnpkg.com/@types/lodash/-/lodash-4.14.188.tgz#e4990c4c81f7c9b00c5ff8eae389c10f27980da5"
+ integrity sha512-zmEmF5OIM3rb7SbLCFYoQhO4dGt2FRM9AMkxvA3LaADOF1n8in/zGJlWji9fmafLoNyz+FoL6FE0SLtGIArD7w==
+
"@types/mime@*":
version "3.0.1"
resolved "https://registry.yarnpkg.com/@types/mime/-/mime-3.0.1.tgz#5f8f2bca0a5863cb69bc0b0acd88c96cb1d4ae10"