diff --git a/src/10th/Roster.jsx b/src/10th/Roster.jsx
index 63af7fa..908be67 100644
--- a/src/10th/Roster.jsx
+++ b/src/10th/Roster.jsx
@@ -5,7 +5,7 @@ import { Arrow, wavyLine } from "../assets/icons";
import { Weapons, hasDifferentProfiles } from "./Weapons";
import { useLocalStorage } from "../helpers/useLocalStorage";
-export const Roster = ({ roster, onePerPage }) => {
+export const Roster = ({ roster, onePerPage, colorUserChoice }) => {
if (!roster) {
return null;
}
@@ -31,13 +31,18 @@ export const Roster = ({ roster, onePerPage }) => {
{name} [{cost.commandPoints} CP, {cost.points} pts]
{forces.map((force, index) => (
-
+
))}
);
};
-const Force = ({ force, onePerPage }) => {
+const Force = ({ force, onePerPage, colorUserChoice }) => {
const { units, factionRules, rules, catalog } = force;
var mergedRules = new Map([...factionRules, ...rules]);
return (
@@ -54,6 +59,7 @@ const Force = ({ force, onePerPage }) => {
catalog={catalog}
onePerPage={onePerPage}
forceRules={rules}
+ colorUserChoice={colorUserChoice}
/>
))}
@@ -61,7 +67,14 @@ const Force = ({ force, onePerPage }) => {
);
};
-const Unit = ({ unit, index, catalog, onePerPage, forceRules }) => {
+const Unit = ({
+ unit,
+ index,
+ catalog,
+ onePerPage,
+ forceRules,
+ colorUserChoice,
+}) => {
const [hide, setHide] = useState(false);
const uploadRef = useRef();
let {
@@ -105,7 +118,9 @@ const Unit = ({ unit, index, catalog, onePerPage, forceRules }) => {
);
});
- const overridePrimary = getOverridePrimary(factions, keywords);
+ const overridePrimary = colorUserChoice
+ ? ""
+ : getOverridePrimary(factions, keywords);
useEffect(() => {
// Check if the browser is Safari, and if so, remove the accept attribute
diff --git a/src/App.jsx b/src/App.jsx
index a98857f..99d75d7 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -18,6 +18,7 @@ function App() {
const [edition, setEdition] = useState(10); // [9, 10]
const [onePerPage, setOnePerPage] = useState(false);
const [primaryColor, setPrimaryColor] = useState("#536766");
+ const [colorUserChoice, setColorUserChoice] = useState(false);
const uploadRef = useRef();
async function handleFileSelect(event) {
const files = event?.target?.files;
@@ -155,6 +156,7 @@ function App() {
useEffect(() => {
if (roster) {
setPrimaryColor(getPrimaryColor(roster.forces[0].catalog));
+ setColorUserChoice(false);
}
}, [roster]);
@@ -328,6 +330,7 @@ function App() {
value={primaryColor}
onChange={(e) => {
setPrimaryColor(e.target.value);
+ setColorUserChoice(true);
}}
>
Custom Color
@@ -336,9 +339,10 @@ function App() {
{roster &&
primaryColor !== getPrimaryColor(roster.forces[0].catalog) && (