db8b67102d
* style: improved profile settings * chore: minor improvements * style: improved workspace settings * style: workspace settings content * style: improved project settings * fix: project settings flat map * chore: add back navigation from settings pages * style: settings content * style: estimates list * refactor: remove old code * refactor: removed unnecessary line breaks * refactor: create a common component for page header * chore: add fade-in animation to sidebar * fix: formatting * fix: project settings sidebar header * fix: workspace settings sidebar header * fix: settings content wrapper scroll * chore: separate project settings features * fix: formatting * refactor: custom theme selector * refactor: settings headings * refactor: settings headings * fix: project settings sidebar padding * fix: sidebar header padding * fix: sidebar item permissions * fix: missing editable check * refactor: remove unused files * chore: remove unnecessary code * chore: add missing translations * fix: formatting
55 lines
1.8 KiB
TypeScript
55 lines
1.8 KiB
TypeScript
import { observer } from "mobx-react";
|
|
// plane imports
|
|
import { PROFILE_SETTINGS_TABS } from "@plane/constants";
|
|
import { useTranslation } from "@plane/i18n";
|
|
import type { TProfileSettingsTabs } from "@plane/types";
|
|
// components
|
|
import { LogoSpinner } from "@/components/common/logo-spinner";
|
|
import { PageHead } from "@/components/core/page-title";
|
|
import { ProfileSettingsContent } from "@/components/settings/profile/content";
|
|
import { ProfileSettingsSidebarRoot } from "@/components/settings/profile/sidebar";
|
|
// hooks
|
|
import { useUser } from "@/hooks/store/user";
|
|
import { useAppRouter } from "@/hooks/use-app-router";
|
|
// local imports
|
|
import type { Route } from "../+types/layout";
|
|
|
|
function ProfileSettingsPage(props: Route.ComponentProps) {
|
|
const { profileTabId } = props.params;
|
|
// router
|
|
const router = useAppRouter();
|
|
// store hooks
|
|
const { data: currentUser } = useUser();
|
|
// translation
|
|
const { t } = useTranslation();
|
|
// derived values
|
|
const isAValidTab = PROFILE_SETTINGS_TABS.includes(profileTabId as TProfileSettingsTabs);
|
|
|
|
if (!currentUser || !isAValidTab)
|
|
return (
|
|
<div className="size-full grid place-items-center px-4">
|
|
<LogoSpinner />
|
|
</div>
|
|
);
|
|
|
|
return (
|
|
<>
|
|
<PageHead title={`${t("profile.label")} - ${t("general_settings")}`} />
|
|
<div className="relative size-full">
|
|
<div className="size-full flex">
|
|
<ProfileSettingsSidebarRoot
|
|
activeTab={profileTabId as TProfileSettingsTabs}
|
|
className="w-[250px]"
|
|
updateActiveTab={(tab) => router.push(`/settings/profile/${tab}`)}
|
|
/>
|
|
<ProfileSettingsContent
|
|
activeTab={profileTabId as TProfileSettingsTabs}
|
|
className="grow py-20 px-page-x mx-auto w-fit max-w-225"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</>
|
|
);
|
|
}
|
|
|
|
export default observer(ProfileSettingsPage);
|