Websites/liljudd-website
1
0
Fork 0
Code Issues Pull requests Projects Releases 3 Packages Wiki Activity

Solved using Signals

Browse source
This commit is contained in:
Aron Malcher 2024-01-20 19:11:14 +01:00
parent ede3403765
commit 886bf11b40
Signed by: aronmal
GPG key ID: 816B7707426FC612
1 changed files with 23 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

37
src/routes/config/[guildId].tsx
View file

@ -137,10 +137,12 @@ function config() {
const params = useParams(); const params = useParams();
const navigator = useNavigate(); const navigator = useNavigate();
const location = useLocation(); const location = useLocation();
let timezoneRef: HTMLInputElement; const [timezoneRef, setTimezoneRef] = createSignal<HTMLInputElement>();
let timePlanningRef: HTMLInputElement; const [timePlanningRef, setTimePlanningRef] =
let channelRef: HTMLSelectElement; createSignal<HTMLInputElement>();
let pingableRolesRef: HTMLInputElement; const [channelRef, setChannelRef] = createSignal<HTMLSelectElement>();
const [pingableRolesRef, setPingableRolesRef] =
createSignal<HTMLInputElement>();
const [timezone, setTimezone] = createSignal(guessTZ()); const [timezone, setTimezone] = createSignal(guessTZ());
const payload = createAsync( const payload = createAsync(
@ -187,26 +189,33 @@ function config() {
); );
createEffect(() => { createEffect(() => {
timezoneRef.value = timezone(); const ref = timezoneRef();
if (!ref) return;
ref.value = timezone();
}); });
createEffect(() => { createEffect(() => {
timePlanningRef.checked = config.features.timePlanning.enabled; const ref = timePlanningRef();
if (!ref) return;
ref.checked = config.features.timePlanning.enabled;
}); });
createEffect(() => { createEffect(() => {
const channelId = payload().guild.channel; const channelId = payload().guild.channel;
setConfig("features", "timePlanning", "channelId", channelId); setConfig("features", "timePlanning", "channelId", channelId);
console.log(channelId, payload()); console.log(channelId, payload());
const ref = channelRef();
if (!ref) return;
if ( if (
!channelRef || !ref ||
!channelId || !channelId ||
!payload().guild.channels.find((e) => e.id === channelId) !payload().guild.channels.find((e) => e.id === channelId)
) )
return; return;
channelRef.value = channelId; ref.value = channelId;
}); });
createEffect(() => { createEffect(() => {
if (!pingableRolesRef) return; const ref = pingableRolesRef();
pingableRolesRef.checked = config.features.timePlanning.pingableRoles; if (!ref) return;
ref.checked = config.features.timePlanning.pingableRoles;
}); });
return ( return (
@ -239,7 +248,7 @@ function config() {
type="text" type="text"
list="timezones" list="timezones"
id="timezone" id="timezone"
ref={timezoneRef!} ref={(e) => setTimezoneRef(e)}
// disabled={!tzNames().find((e) => e === timezone())} // disabled={!tzNames().find((e) => e === timezone())}
onInput={(e) => setTimezone(e.target.value)} onInput={(e) => setTimezone(e.target.value)}
/> />
@ -276,7 +285,7 @@ function config() {
hidden hidden
type="checkbox" type="checkbox"
id="timePlanning" id="timePlanning"
ref={timePlanningRef!} ref={(e) => setTimePlanningRef(e)}
onInput={(e) => onInput={(e) =>
setConfig("features", "timePlanning", "enabled", e.target.checked) setConfig("features", "timePlanning", "enabled", e.target.checked)
} }
@ -288,7 +297,7 @@ function config() {
<div class="flex-row"> <div class="flex-row">
<label>Target channel:</label> <label>Target channel:</label>
<select <select
ref={channelRef!} ref={(e) => setChannelRef(e)}
onInput={(e) => onInput={(e) =>
setConfig( setConfig(
"features", "features",
@ -327,7 +336,7 @@ function config() {
hidden hidden
type="checkbox" type="checkbox"
id="pingableRoles" id="pingableRoles"
ref={pingableRolesRef!} ref={(e) => setPingableRolesRef(e)}
onInput={(e) => onInput={(e) =>
setConfig( setConfig(
"features", "features",