import React, { Fragment } from "react";
import useLoader from "~game/lib/Loader";
import InGameSpaceBG from "./backgrounds/InGameSpaceBG";

// Resources, this will make TS go crazy!

//@ts-expect-error Image resource
import NoiseSpaceFine from "~/../assets/images/noise/space_fine.png";
//@ts-expect-error Image resource
import NoiseSpaceSparse from "~/../assets/images/noise/space_sparse.png";
import LoadingScreen from "./LoadingScreen";
import useUILayer from "~ui/utils/useLayer";

// Scene switcher entry
export interface MapEditorScene {
  type: "MapEditor";
}

export default function MapEditor() {
  const { loaded, resources } = useLoader({
    bg_fine: NoiseSpaceFine,
    bg_sparse: NoiseSpaceSparse,
  });
  const id = useUILayer({ type: "MapEditor" }, loaded);

  if (!loaded) {
    return <LoadingScreen />;
  }

  return (
    <Fragment>
      <InGameSpaceBG
        textures={{
          noise_fine: resources.bg_fine,
          noise_sparse: resources.bg_sparse,
        }}
      />
    </Fragment>
  );
}