Skip to content

Commit

Permalink
Remove fontColorLikeRank
Browse files Browse the repository at this point in the history
  • Loading branch information
@raimannma
raimannma committed Feb 16, 2025
1 parent 6c4c028 commit aa5ed79
Show file tree
Hide file tree
Showing 4 changed files with 33 additions and 73 deletions.
78 changes: 31 additions & 47 deletions app/components/widget-builder.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,6 @@ export default function WidgetBuilder({ region, accountId }: WidgetBuilderProps)
const [variable, setVariable] = useState<string>("wins_losses_today");
const [prefix, setPrefix] = useState<string>("Score: ");
const [suffix, setSuffix] = useState<string>("");
const [fontColorLikeRank, setFontColorLikeRank] = useState<boolean>(true);
const [fontColor, setFontColor] = useState<Color>("#ffffff");
const [labels, setLabels] = useState<string[]>(DEFAULT_LABELS);
const [extraArgs, setExtraArgs] = useState<{ [key: string]: string }>({});
Expand Down Expand Up @@ -96,7 +95,6 @@ export default function WidgetBuilder({ region, accountId }: WidgetBuilderProps)
case "raw":
url.searchParams.set("fontColor", fontColor);
url.searchParams.set("variable", variable);
url.searchParams.set("fontColorLikeRank", fontColorLikeRank.toString());
url.searchParams.set("prefix", prefix);
url.searchParams.set("suffix", suffix);
setWidgetUrl(url.toString());
Expand All @@ -106,7 +104,6 @@ export default function WidgetBuilder({ region, accountId }: WidgetBuilderProps)
accountId={accountId}
variable={variable}
fontColor={fontColor}
fontColorLikeRank={fontColorLikeRank}
extraArgs={extraArgs}
prefix={prefix}
suffix={suffix}
Expand Down Expand Up @@ -134,7 +131,6 @@ export default function WidgetBuilder({ region, accountId }: WidgetBuilderProps)
opacity,
prefix,
suffix,
fontColorLikeRank,
]);

const themes: { value: Theme; label: string }[] = [
Expand Down Expand Up @@ -188,23 +184,37 @@ export default function WidgetBuilder({ region, accountId }: WidgetBuilderProps)

{widgetType === "raw" && (
<>
<div className="w-fit">
<label htmlFor="variable" className="block text-sm font-medium text-gray-700">
Variable
</label>
<select
id="variable"
value={variable}
onChange={(e) => setVariable(e.target.value)}
className="mt-1 block w-full rounded-md border border-gray-300 bg-white px-3 py-2 shadow-xs focus:border-blue-500 focus:outline-hidden focus:ring-1 focus:ring-blue-500 text-black"
>
<option value="">Select a variable</option>
{availableVariables.map((v) => (
<option key={v.name} value={v.name} title={v.description}>
{v.name}
</option>
))}
</select>
<div className="grid grid-cols-2 items-center w-full gap-4">
<div>
<label htmlFor="variable" className="block text-sm font-medium text-gray-700">
Variable
</label>
<select
id="variable"
value={variable}
onChange={(e) => setVariable(e.target.value)}
className="mt-1 block w-full rounded-md border border-gray-300 bg-white px-3 py-2 shadow-xs focus:border-blue-500 focus:outline-hidden focus:ring-1 focus:ring-blue-500 text-black"
>
<option value="">Select a variable</option>
{availableVariables.map((v) => (
<option key={v.name} value={v.name} title={v.description}>
{v.name}
</option>
))}
</select>
</div>
<div>
<label htmlFor="fontColor" className="block text-sm font-medium text-gray-700">
Font Color
</label>
<input
type="color"
id="fontColor"
value={fontColor}
onChange={(e) => setFontColor(e.target.value as Color)}
className="mt-1 block w-full h-10 rounded-md border border-gray-300 bg-white px-3 py-2 shadow-xs focus:border-blue-500 focus:outline-hidden focus:ring-1 focus:ring-blue-500 text-black disabled:opacity-50 disabled:cursor-not-allowed disabled:bg-gray-200"
/>
</div>
</div>
<div className="grid grid-cols-2 items-center w-full gap-4">
<div>
Expand Down Expand Up @@ -232,32 +242,6 @@ export default function WidgetBuilder({ region, accountId }: WidgetBuilderProps)
/>
</div>
</div>
<div className="grid grid-cols-2 items-center w-full gap-4">
<div className="flex items-center gap-2">
<input
type="checkbox"
id="fontColorLikeRank"
checked={fontColorLikeRank}
onChange={(e) => setFontColorLikeRank(e.target.checked)}
className="block rounded-md border border-gray-300 bg-white px-3 py-2 shadow-xs focus:border-blue-500 focus:outline-hidden text-black"
/>
<label htmlFor="fontColor" className="block text-sm font-medium text-gray-700">
Font Color Like Rank (if available)
</label>
</div>
<div>
<label htmlFor="fontColor" className="block text-sm font-medium text-gray-700">
Font Color
</label>
<input
type="color"
id="fontColor"
value={fontColor}
onChange={(e) => setFontColor(e.target.value as Color)}
className="mt-1 block w-full h-10 rounded-md border border-gray-300 bg-white px-3 py-2 shadow-xs focus:border-blue-500 focus:outline-hidden focus:ring-1 focus:ring-blue-500 text-black disabled:opacity-50 disabled:cursor-not-allowed disabled:bg-gray-200"
/>
</div>
</div>
<ExtraArguments
extraArgs={availableVariables.filter((v) => variable === v.name).flatMap((v) => v.extra_args ?? [])}
extraValues={extraArgs || {}}
Expand Down
25 changes: 2 additions & 23 deletions app/components/widgets/raw.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,21 +11,14 @@ export const RawWidget: FC<RawWidgetProps> = ({
suffix = "",
extraArgs = {},
fontColor = "#ffffff",
fontColorLikeRank = false,
refreshInterval = UPDATE_INTERVAL_MS,
}) => {
const [stat, setStat] = useState<string | null>(null);
const [loading, setLoading] = useState(true);
const [badgeLevel, setBadgeLevel] = useState<number | null>(null);
const [fontColorState, setFontColor] = useState(fontColor);

const fetchStats = async (region: Region, accountId: string, variable: string, extraArgs: Record<string, string>) => {
const url = new URL(`https://data.deadlock-api.com/v1/commands/${region}/${accountId}/resolve-variables`);
const variables = [variable];
if (fontColorLikeRank) {
variables.push("leaderboard_rank_badge_level");
}
url.searchParams.append("variables", variables.join(","));
url.searchParams.append("variables", [variable].join(","));

// biome-ignore lint/complexity/noForEach: <explanation>
Object.entries(extraArgs).forEach(([key, value]) => {
Expand Down Expand Up @@ -56,27 +49,13 @@ export const RawWidget: FC<RawWidgetProps> = ({
setLoading(statsLoading);
if (data) {
setStat(data[variable]);
if ("leaderboard_rank_badge_level" in data) {
setBadgeLevel(Number.parseInt(data.leaderboard_rank_badge_level));
}
}
if (statsError) {
setStat(null);
console.error(`Failed to fetch stats: ${statsError}`);
}
}, [data, variable, statsLoading, statsError]);

useEffect(() => {
let newFontColor = fontColor;
if (fontColorLikeRank && ranksData && badgeLevel) {
const rankData = ranksData.find((r) => r.tier === Math.floor(badgeLevel / 10));
if (rankData) {
newFontColor = rankData.color as Color;
}
}
setFontColor(newFontColor);
}, [ranksData, badgeLevel, fontColorLikeRank, fontColor]);

return (
<div>
{loading ? (
Expand All @@ -89,7 +68,7 @@ export const RawWidget: FC<RawWidgetProps> = ({
) : stat ? (
<>
<div className="flex gap-2 w-fit items-center">
<div className="text-4xl font-bold" style={{ color: fontColorState }}>
<div className="text-4xl font-bold" style={{ color: fontColor }}>
{variable.endsWith("img") ? (
<img src={stat} alt={variable} className="h-20 rounded-full" />
) : (
Expand Down
2 changes: 0 additions & 2 deletions app/routes/widgets.$region.$accountId.$widgetType.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -95,7 +95,6 @@ export default function Widget() {
const variable = searchParams.get("variable");
const prefix = searchParams.get("prefix") ?? "";
const suffix = searchParams.get("suffix") ?? "";
const fontColorLikeRank = searchParams.get("fontColorLikeRank") === "true";
const fontColor = (searchParams.get("fontColor") as Color) ?? "#FFFFFF";
const extraArgs = Object.fromEntries(
Array.from(searchParams.entries()).filter(([key]) => !["variable", "fontColor"].includes(key)),
Expand All @@ -108,7 +107,6 @@ export default function Widget() {
accountId={accountId}
variable={variable}
fontColor={fontColor}
fontColorLikeRank={fontColorLikeRank}
extraArgs={extraArgs}
prefix={prefix}
suffix={suffix}
Expand Down
1 change: 0 additions & 1 deletion app/types/widget.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,6 @@ export type RawWidgetProps = {
suffix?: string;
extraArgs?: Record<string, string>;
fontColor: Color;
fontColorLikeRank: boolean;
refreshInterval?: number;
};

Expand Down

0 comments on commit aa5ed79

Please sign in to comment.