d34dbug Posts - Answer Overflow

d34dbug

•Created by d34dbug on 1/18/2024 in #support

Reactivity lost if awaited function precedes?

So this is reactive (reloads the desired componant), but is out of order from what I need to happen.

<button id="but_sel"
   onClick={async (e) => {
      e.preventDefault();
      if(sessionSelected()){
         props.setActiveSession(sessionSelected());
         await set_session({id:sessionSelected()});
         props.setSection(undefined);
      }else{
         await message("please choose a session");
      }
   }}
>

<button id="but_sel"
   onClick={async (e) => {
      e.preventDefault();
      if(sessionSelected()){
         props.setActiveSession(sessionSelected());
         await set_session({id:sessionSelected()});
         props.setSection(undefined);
      }else{
         await message("please choose a session");
      }
   }}
>

This does not reload the desired component, but is the correct order for what I need to happen. How do I resolve this situation?

<button id="but_sel"
   onClick={async (e) => {
       e.preventDefault();
       if(sessionSelected()){
          await set_session({id:sessionSelected()});
          props.setActiveSession(sessionSelected());       
          props.setSection(undefined);
       }else{
          await message("please choose a session");
       }
   }}
>

<button id="but_sel"
   onClick={async (e) => {
       e.preventDefault();
       if(sessionSelected()){
          await set_session({id:sessionSelected()});
          props.setActiveSession(sessionSelected());       
          props.setSection(undefined);
       }else{
          await message("please choose a session");
       }
   }}
>

I need to ensure that the backend is updated first because the component that is loaded fetches the updated data as a createResource, so I need to make sure that data is correct. I am trying to avoid attempting to keep state in sync between the backend and frontend by using the backend as the source of truth. Since this is a Tauri app, since the backend is local, delays are not an issue.

33 replies

SSolidJS

•Created by d34dbug on 12/27/2023 in #support

Right side of assignment cannot be destructured

This may not be a solid issue but I am really confused. I did not have this problem when I was using vanilla Javascript; however, switching to solidjs changed a massive amount of how the app functions. So I am trying build a tauri app and I have a command:

async function new_session({ name, temp }) {
    let msg;
    if (name) {
      msg = {
        name: name,
        temp: temp
      }
    } else {
      msg = { temp: temp }
    }
    console.log({ "msg": JSON.stringify(msg) })
    let check = await invoke("new_session", { "msg": JSON.stringify(msg) })
    return check
  }

async function new_session({ name, temp }) {
    let msg;
    if (name) {
      msg = {
        name: name,
        temp: temp
      }
    } else {
      msg = { temp: temp }
    }
    console.log({ "msg": JSON.stringify(msg) })
    let check = await invoke("new_session", { "msg": JSON.stringify(msg) })
    return check
  }

This is the button that should execute that command:

 <button
    onClick={async (e) => {
      e.preventDefault();
      switch(selectedOption()){
        case "temp_session":
          let x = await new_session();
          console.log("x: ",x);
          break;
        default:
          console.log("choose a session");
        };
      console.log("selected option:", selectedOption());
    }}
 >

 <button
    onClick={async (e) => {
      e.preventDefault();
      switch(selectedOption()){
        case "temp_session":
          let x = await new_session();
          console.log("x: ",x);
          break;
        default:
          console.log("choose a session");
        };
      console.log("selected option:", selectedOption());
    }}
 >

In vanilla javascript the command could be executed fine. However, I created a solid version so the app might be a little easier to reason through. All my commands got added to a commands.jsx file and the commands should get imported to get used. So i'm exporting the function from commands and importing it into the module I need to use it in. However, when I press the button that should execute it I get the error: Unhandled Promise Rejection: TypeError: Right side of assignment cannot be destructured I have absolutely no idea why it's broken, why it thinks it's destructuring something and how I might go about fixing it. Can someone give me some insight?

8 replies

Gaming

Programming