polyzium Posts - Answer Overflow

polyzium

Explore posts from servers

•Created by polyzium on 10/27/2023 in #support

Lazy named import?

I have code that depends on an async function for data, and thus I need to await it. Making a dirty hack to adapt an async function to a sync component via signals was a much simpler thing to make than what I am about to explain. I have an async component:

async function Settings(): Promise<JSX.Element> {
  ...

async function Settings(): Promise<JSX.Element> {
  ...

the data fetcher:

async function Settings_init() {
    setConfig(await invoke('config'));
    // vvv No async vvv
    //invoke(config).then((data)=>setConfig(data as Config))
}

async function Settings_init() {
    setConfig(await invoke('config'));
    // vvv No async vvv
    //invoke(config).then((data)=>setConfig(data as Config))
}

and the export:

export {Settings, Settings_init};

export {Settings, Settings_init};

I searched this up on google and I tried this:

const Settings = lazy(() =>
    import("./tabs/SettingsTab").then((module) => ({ default: module.Settings }))
);

const Settings = lazy(() =>
    import("./tabs/SettingsTab").then((module) => ({ default: module.Settings }))
);

But I get an error:

Type 'Promise<{ default: never; } | { default: () => Promise<Element>; }>' is not assignable to type 'Promise<{ default: Component<any>; }>'.
  Type '{ default: never; } | { default: () => Promise<Element>; }' is not assignable to type '{ default: Component<any>; }'.
    Type '{ default: () => Promise<JSX.Element>; }' is not assignable to type '{ default: Component<any>; }'.
      The types returned by 'default(...)' are incompatible between these types.
        Type 'Promise<Element>' is not assignable to type 'Element'.

Type 'Promise<{ default: never; } | { default: () => Promise<Element>; }>' is not assignable to type 'Promise<{ default: Component<any>; }>'.
  Type '{ default: never; } | { default: () => Promise<Element>; }' is not assignable to type '{ default: Component<any>; }'.
    Type '{ default: () => Promise<JSX.Element>; }' is not assignable to type '{ default: Component<any>; }'.
      The types returned by 'default(...)' are incompatible between these types.
        Type 'Promise<Element>' is not assignable to type 'Element'.

I don't really understand what went wrong here, but one thing for sure, whatever broke this, it broke it terribly. What is the fix for this, and if there isn't, should I go back to that dirty hack (see comment)?

26 replies

Gaming

Programming