monkeytypegame/monkeytype
1
1
Fork 0
mirror of https://github.com/monkeytypegame/monkeytype.git synced 2024-09-20 15:26:15 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: year selector flashing in the top left on page load (fehmer) (#5476)

Browse source
This commit is contained in:
Christian Fehmer 2024-06-07 12:33:53 +02:00 committed by GitHub
parent fad3f6e8d1
commit a8c7134f80
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 28 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

48
frontend/src/ts/elements/test-activity.ts
View file

@ -4,23 +4,7 @@ import { getTestActivityCalendar } from "../db";
import * as ServerConfiguration from "../ape/server-configuration";
import * as DB from "../db";
const yearSelector = new SlimSelect({
select: "#testActivity .yearSelect",
settings: {
showSearch: false,
},
events: {
afterChange: async (newVal): Promise<void> => {
yearSelector?.disable();
const selected = newVal[0]?.value as string;
const activity = await getTestActivityCalendar(selected);
update(activity);
if ((yearSelector?.getData() ?? []).length > 1) {
yearSelector?.enable();
}
},
},
});
let yearSelector: SlimSelect | undefined = undefined;
export function init(
calendar?: MonkeyTypes.TestActivityCalendar,
@ -31,6 +15,8 @@ export function init(
return;
}
$("#testActivity").removeClass("hidden");
yearSelector = getYearSelector();
initYearSelector("current", userSignUpDate?.getFullYear() || 2022);
update(calendar);
}
@ -66,7 +52,6 @@ export function initYearSelector(
startYear: number
): void {
const currentYear = new Date().getFullYear();
const years: DataObjectPartial[] = [
{
text: "last 12 months",
@ -88,8 +73,9 @@ export function initYearSelector(
}
}
yearSelector.setData(years);
years.length > 1 ? yearSelector.enable() : yearSelector.disable();
const yearSelect = getYearSelector();
yearSelect.setData(years);
years.length > 1 ? yearSelect.enable() : yearSelect.disable();
}
function updateMonths(months: MonkeyTypes.TestActivityMonth[]): void {
@ -102,3 +88,25 @@ function updateMonths(months: MonkeyTypes.TestActivityMonth[]): void {
)
.join("");
}
function getYearSelector(): SlimSelect {
if (yearSelector !== undefined) return yearSelector;
yearSelector = new SlimSelect({
select: "#testActivity .yearSelect",
settings: {
showSearch: false,
},
events: {
afterChange: async (newVal): Promise<void> => {
yearSelector?.disable();
const selected = newVal[0]?.value as string;
const activity = await getTestActivityCalendar(selected);
update(activity);
if ((yearSelector?.getData() ?? []).length > 1) {
yearSelector?.enable();
}
},
},
});
return yearSelector;
}