"use client";
import PasswordForm from "@/components/form/settings/password";
import ProfileForm from "@/components/form/settings/profile";
import { getProfile } from "@/service/master-user";
import { Tab, Tabs } from "@nextui-org/react";
import { useEffect, useState } from "react";

export default function Settings() {
  const [profile, setProfile] = useState<any>();
  useEffect(() => {
    const initFetch = async () => {
      const profile = await getProfile();
      setProfile(profile?.data?.data);
    };
    initFetch();
  }, []);
  return (
    <div className="w-full lg:w-[60%] p-5">
      <div className="flex flex-col bg-gray-100 dark:bg-stone-900 text-black dark:text-white rounded-md p-5">
        <Tabs aria-label="Tabs radius" radius="sm">
          <Tab key="profile" title="Profile">
            <ProfileForm profile={profile} />
          </Tab>
          <Tab key="music" title="Password">
            <PasswordForm />
          </Tab>
        </Tabs>
      </div>
    </div>
  );
}
