import { define } from "../../utils.ts";
import { page } from "fresh";
import { SessionCookie } from "../../routes/auth/callback.ts";
import { getUser } from "../../services/userService.ts";
import { createPublicId } from "../../helpers.ts";
import UserProfileEdit from "../../islands/UserProfileEdit.tsx";
import { User } from "../../db/interfaces.ts";

export const handler = define.handlers(async (ctx) => {
  const stateData: SessionCookie = ctx.state.data ??
    {
      started_on: 0,
      user_name: "",
      user_id: "",
      role: "",
      user_encrypted: false,
    };

  const userId = stateData.user_id;
  const publicId = await createPublicId(userId) || "";
  const user = await getUser(userId);
  if (user) {
    user.id = publicId;
    user.started_on = 0;
    user.updated_on = 0;
    return page({
      stateData,
      urlRoute: ctx.state.urlRoute,
      publicId: publicId,
      user: user,
      stateId: ctx.state.stateId,
    });
  } else {
    return new Response("Oops your profile was not found", {
      status: 404,
      headers: { "Content-Type": "text/plain" },
    });
  }
});

export default define.page(
  (
    { data }: {
      data: {
        stateData: SessionCookie;
        urlRoute: string;
        publicId: string;
        user: User;
        stateId: string;
      };
    },
  ) => {
    return (
      <main class="min-h-screen bg-black flex flex-col items-center justify-start pt-0">
        <div class="w-full max-w-4xl px-8 sm:px-12 lg:px-24 mt-8">
          <UserProfileEdit
            user={data.user}
            isEncrypted={data.stateData.user_encrypted}
          />
        </div>
      </main>
    );
  },
);