Skip to content

Commit

Permalink
chore: upgrade slim-select (@Miodec) (#5884)
Browse files Browse the repository at this point in the history
Finally!
  • Loading branch information
Miodec authored Sep 13, 2024
1 parent 2a0a5b4 commit 8b2c172
Show file tree
Hide file tree
Showing 12 changed files with 9 additions and 57 deletions.
2 changes: 1 addition & 1 deletion frontend/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -89,7 +89,7 @@
"konami": "1.6.3",
"lz-ts": "1.1.2",
"object-hash": "3.0.0",
"slim-select": "2.8.1",
"slim-select": "2.9.0",
"stemmer": "2.0.1",
"throttle-debounce": "5.0.2",
"zod": "3.23.8"
Expand Down
20 changes: 0 additions & 20 deletions frontend/src/ts/elements/account/result-filters.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,6 @@ import Config from "../../config";
import * as Notifications from "../notifications";
import Ape from "../../ape/index";
import * as Loader from "../loader";
// @ts-expect-error TODO: update slim-select
import SlimSelect from "slim-select";
import { QuoteLength } from "@monkeytype/contracts/schemas/configs";
import {
Expand Down Expand Up @@ -346,12 +345,10 @@ export function updateActive(): void {
}

for (const [id, select] of Object.entries(groupSelects)) {
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- TODO: update slim-select
const ss = select;
const group = getGroup(id as ResultFiltersGroup);
const everythingSelected = Object.values(group).every((v) => v === true);

// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- TODO: update slim-select
const newData = ss.store.getData();

const allOption = $(
Expand Down Expand Up @@ -680,10 +677,8 @@ function adjustScrollposition(
group: ResultFiltersGroup,
topItem: number = 0
): void {
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- TODO: update slim-select
const slimSelect = groupSelects[group];
if (slimSelect === undefined) return;
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- TODO: update slim-select
const listElement = slimSelect.render.content.list;
const topListItem = listElement.children.item(topItem) as HTMLElement;

Expand Down Expand Up @@ -779,7 +774,6 @@ export async function appendButtons(
);
if (el) {
el.innerHTML = html;
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- TODO: update slim-select
groupSelects["language"] = new SlimSelect({
select: el.querySelector(".languageSelect") as HTMLSelectElement,
settings: {
Expand All @@ -790,16 +784,12 @@ export async function appendButtons(
},
events: {
beforeChange: (
// @ts-expect-error TODO: update slim-select
selectedOptions,
// @ts-expect-error TODO: update slim-select
oldSelectedOptions
): void | boolean => {
return selectBeforeChangeFn(
"language",
// eslint-disable-next-line @typescript-eslint/no-unsafe-argument
selectedOptions,
// eslint-disable-next-line @typescript-eslint/no-unsafe-argument
oldSelectedOptions
);
},
Expand Down Expand Up @@ -841,7 +831,6 @@ export async function appendButtons(
);
if (el) {
el.innerHTML = html;
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- TODO: update slim-select
groupSelects["funbox"] = new SlimSelect({
select: el.querySelector(".funboxSelect") as HTMLSelectElement,
settings: {
Expand All @@ -852,16 +841,12 @@ export async function appendButtons(
},
events: {
beforeChange: (
// @ts-expect-error TODO: update slim-select
selectedOptions,
// @ts-expect-error TODO: update slim-select
oldSelectedOptions
): void | boolean => {
return selectBeforeChangeFn(
"funbox",
// eslint-disable-next-line @typescript-eslint/no-unsafe-argument
selectedOptions,
// eslint-disable-next-line @typescript-eslint/no-unsafe-argument
oldSelectedOptions
);
},
Expand Down Expand Up @@ -899,7 +884,6 @@ export async function appendButtons(
);
if (el) {
el.innerHTML = html;
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- TODO: update slim-select
groupSelects["tags"] = new SlimSelect({
select: el.querySelector(".tagsSelect") as HTMLSelectElement,
settings: {
Expand All @@ -910,16 +894,12 @@ export async function appendButtons(
},
events: {
beforeChange: (
// @ts-expect-error TODO: update slim-select
selectedOptions,
// @ts-expect-error TODO: update slim-select
oldSelectedOptions
): void | boolean => {
return selectBeforeChangeFn(
"tags",
// eslint-disable-next-line @typescript-eslint/no-unsafe-argument
selectedOptions,
// eslint-disable-next-line @typescript-eslint/no-unsafe-argument
oldSelectedOptions
);
},
Expand Down
3 changes: 0 additions & 3 deletions frontend/src/ts/elements/leaderboards.ts
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,6 @@ import * as ConnectionState from "../states/connection";
import * as Skeleton from "../utils/skeleton";
import { debounce } from "throttle-debounce";
import Format from "../utils/format";
// @ts-expect-error TODO: update slim-select
import SlimSelect from "slim-select";
import { getHtmlByUserFlags } from "../controllers/user-flag-controller";
import {
Expand Down Expand Up @@ -712,7 +711,6 @@ export function show(): void {
Config.typingSpeedUnit + '<br><div class="sub">accuracy</div>'
);

// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- TODO: update slim-select
languageSelector = new SlimSelect({
select:
"#leaderboardsWrapper #leaderboards .leaderboardsTop .buttonGroup.timeRange .languageSelect",
Expand All @@ -737,7 +735,6 @@ export function show(): void {
selected: lang === currentLanguage,
})),
events: {
// @ts-expect-error TODO: update slim-select
afterChange: (newVal): void => {
currentLanguage = newVal[0]?.value as string;
updateTitle();
Expand Down
4 changes: 1 addition & 3 deletions frontend/src/ts/elements/settings/settings-group.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import { ConfigValue } from "@monkeytype/contracts/schemas/configs";
import Config from "../../config";
import * as Notifications from "../notifications";
// @ts-expect-error TODO: update slim-select
import SlimSelect from "slim-select";
import { debounce } from "throttle-debounce";

Expand Down Expand Up @@ -119,8 +118,7 @@ export default class SettingsGroup<T extends ConfigValue> {

select.value = this.configValue as string;

//@ts-expect-error
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unnecessary-type-assertion -- TODO: update slim-select
//@ts-expect-error this is fine, slimselect adds slim to the element
const ss = select.slim as SlimSelect | undefined;
ss?.store.setSelectedBy("value", [this.configValue as string]);
ss?.render.renderValues();
Expand Down
9 changes: 2 additions & 7 deletions frontend/src/ts/elements/test-activity.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,5 @@
// @ts-expect-error TODO: update slim-select
import SlimSelect from "slim-select";
// @ts-expect-error TODO: update slim-select
import type { DataObjectPartial } from "slim-select/dist/store";
import { DataObjectPartial } from "slim-select/store";
import { getTestActivityCalendar } from "../db";
import * as ServerConfiguration from "../ape/server-configuration";
import * as DB from "../db";
Expand All @@ -18,7 +16,6 @@ export function init(
}
$("#testActivity").removeClass("hidden");

// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- TODO: update slim-select
yearSelector = getYearSelector();
initYearSelector("current", userSignUpDate?.getFullYear() || 2022);
update(calendar);
Expand Down Expand Up @@ -85,8 +82,8 @@ export function initYearSelector(
}
}

// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- TODO: update slim-select
const yearSelect = getYearSelector();
// eslint-disable-next-line @typescript-eslint/no-unsafe-argument
yearSelect.setData(years);
years.length > 1 ? yearSelect.enable() : yearSelect.disable();
}
Expand All @@ -104,14 +101,12 @@ function updateMonths(months: MonkeyTypes.TestActivityMonth[]): void {

function getYearSelector(): SlimSelect {
if (yearSelector !== undefined) return yearSelector;
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- TODO: update slim-select
yearSelector = new SlimSelect({
select: "#testActivity .yearSelect",
settings: {
showSearch: false,
},
events: {
// @ts-expect-error TODO: update slim-select
afterChange: async (newVal): Promise<void> => {
yearSelector?.disable();
const selected = newVal[0]?.value as string;
Expand Down
2 changes: 0 additions & 2 deletions frontend/src/ts/modals/quote-report.ts
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,6 @@ import * as Notifications from "../elements/notifications";
import QuotesController from "../controllers/quotes-controller";
import * as CaptchaController from "../controllers/captcha-controller";
import { removeLanguageSize } from "../utils/strings";
// @ts-expect-error TODO: update slim-select
import SlimSelect from "slim-select";
import AnimatedModal, { ShowOptions } from "../utils/animated-modal";
import { CharacterCounter } from "../elements/character-counter";
Expand Down Expand Up @@ -46,7 +45,6 @@ export async function show(
$("#quoteReportModal .reason").val("Grammatical error");
$("#quoteReportModal .comment").val("");

// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- TODO: update slim-select
state.reasonSelect = new SlimSelect({
select: "#quoteReportModal .reason",
settings: {
Expand Down
2 changes: 0 additions & 2 deletions frontend/src/ts/modals/quote-search.ts
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,6 @@ import { isAuthenticated } from "../firebase";
import { debounce } from "throttle-debounce";
import Ape from "../ape";
import * as Loader from "../elements/loader";
// @ts-expect-error TODO: update slim-select
import SlimSelect from "slim-select";
import * as TestState from "../test/test-state";
import AnimatedModal, { ShowOptions } from "../utils/animated-modal";
Expand Down Expand Up @@ -273,7 +272,6 @@ export async function show(showOptions?: ShowOptions): Promise<void> {
$("#quoteSearchModal .goToQuoteApprove").addClass("hidden");
}

// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- TODO: update slim-select
lengthSelect = new SlimSelect({
select: "#quoteSearchModal .quoteLengthFilter",

Expand Down
2 changes: 0 additions & 2 deletions frontend/src/ts/modals/quote-submit.ts
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,6 @@ import * as CaptchaController from "../controllers/captcha-controller";
import * as Strings from "../utils/strings";
import * as JSONData from "../utils/json-data";
import Config from "../config";
// @ts-expect-error TODO: update slim-select
import SlimSelect from "slim-select";
import AnimatedModal, { ShowOptions } from "../utils/animated-modal";
import { CharacterCounter } from "../elements/character-counter";
Expand Down Expand Up @@ -65,7 +64,6 @@ export async function show(showOptions: ShowOptions): Promise<void> {
);
await initDropdown();

// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- TODO: update slim-select
select = new SlimSelect({
select: "#quoteSubmitModal .newQuoteLanguage",
});
Expand Down
2 changes: 0 additions & 2 deletions frontend/src/ts/modals/user-report.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,6 @@ import Ape from "../ape";
import * as Loader from "../elements/loader";
import * as Notifications from "../elements/notifications";
import * as CaptchaController from "../controllers/captcha-controller";
// @ts-expect-error TODO: update slim-select
import SlimSelect from "slim-select";
import AnimatedModal from "../utils/animated-modal";
import { isAuthenticated } from "../firebase";
Expand Down Expand Up @@ -51,7 +50,6 @@ export async function show(options: ShowOptions): Promise<void> {
"Inappropriate name";
(modalEl.querySelector(".comment") as HTMLTextAreaElement).value = "";

// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- TODO: update slim-select
select = new SlimSelect({
select: modalEl.querySelector(".reason") as HTMLElement,
settings: {
Expand Down
4 changes: 0 additions & 4 deletions frontend/src/ts/modals/word-filter.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,6 @@ import * as Misc from "../utils/misc";
import * as JSONData from "../utils/json-data";
import * as CustomText from "../test/custom-text";
import * as Notifications from "../elements/notifications";
// @ts-expect-error TODO: update slim-select
import SlimSelect from "slim-select";
import AnimatedModal, {
HideOptions,
Expand Down Expand Up @@ -159,21 +158,18 @@ export async function show(showOptions?: ShowOptions): Promise<void> {
void modal.show({
...showOptions,
beforeAnimation: async (modalEl) => {
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- TODO: update slim-select
languageSelect = new SlimSelect({
select: "#wordFilterModal .languageInput",
settings: {
contentLocation: modalEl,
},
});
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- TODO: update slim-select
layoutSelect = new SlimSelect({
select: "#wordFilterModal .layoutInput",
settings: {
contentLocation: modal.getModal(),
},
});
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- TODO: update slim-select
presetSelect = new SlimSelect({
select: "#wordFilterModal .presetInput",
settings: {
Expand Down
3 changes: 0 additions & 3 deletions frontend/src/ts/pages/settings.ts
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,6 @@ import Page from "./page";
import { isAuthenticated } from "../firebase";
import { areFunboxesCompatible } from "../test/funbox/funbox-validation";
import { get as getTypingSpeedUnit } from "../utils/typing-speed-units";
// @ts-expect-error TODO: update slim-select
import SlimSelect from "slim-select";

import * as Skeleton from "../utils/skeleton";
Expand Down Expand Up @@ -559,7 +558,6 @@ async function fillSettingsPage(): Promise<void> {
new SlimSelect({
select: themeSelectLightElement,
events: {
// @ts-expect-error TODO: update slim-select
afterChange: (newVal): void => {
UpdateConfig.setThemeLight(newVal[0]?.value as string);
},
Expand All @@ -569,7 +567,6 @@ async function fillSettingsPage(): Promise<void> {
new SlimSelect({
select: themeSelectDarkElement,
events: {
// @ts-expect-error TODO: update slim-select
afterChange: (newVal): void => {
UpdateConfig.setThemeDark(newVal[0]?.value as string);
},
Expand Down
13 changes: 5 additions & 8 deletions pnpm-lock.yaml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

0 comments on commit 8b2c172

Please sign in to comment.