plane/apps/app/pages/index.tsx

184 lines
5.7 KiB
TypeScript
Raw Normal View History

import React from "react";
import Image from "next/image";
import type { NextPage } from "next";
// layouts
import DefaultLayout from "layouts/default-layout";
// services
import authenticationService from "services/authentication.service";
// hooks
import useUserAuth from "hooks/use-user-auth";
import useToast from "hooks/use-toast";
// components
import {
GoogleLoginButton,
GithubLoginButton,
EmailCodeForm,
EmailPasswordForm,
} from "components/account";
// ui
import { Spinner } from "components/ui";
// images
import BluePlaneLogoWithoutText from "public/plane-logos/blue-without-text.png";
2023-06-16 13:30:04 +00:00
// types
type EmailPasswordFormValues = {
email: string;
password?: string;
medium?: string;
};
const HomePage: NextPage = () => {
const { isLoading, mutateUser } = useUserAuth("sign-in");
const { setToastAlert } = useToast();
const handleGoogleSignIn = async ({ clientId, credential }: any) => {
try {
if (clientId && credential) {
const socialAuthPayload = {
medium: "google",
credential,
clientId,
};
const response = await authenticationService.socialAuth(socialAuthPayload);
if (response && response?.user) mutateUser();
} else {
throw Error("Cant find credentials");
}
} catch (err: any) {
setToastAlert({
title: "Error signing in!",
type: "error",
message:
err?.error || "Something went wrong. Please try again later or contact the support team.",
});
}
};
const handleGitHubSignIn = async (credential: string) => {
try {
if (process.env.NEXT_PUBLIC_GITHUB_ID && credential) {
const socialAuthPayload = {
medium: "github",
credential,
clientId: process.env.NEXT_PUBLIC_GITHUB_ID,
};
const response = await authenticationService.socialAuth(socialAuthPayload);
if (response && response?.user) mutateUser();
} else {
throw Error("Cant find credentials");
}
} catch (err: any) {
setToastAlert({
title: "Error signing in!",
type: "error",
message:
err?.error || "Something went wrong. Please try again later or contact the support team.",
});
}
};
2022-11-19 14:21:26 +00:00
2023-06-16 13:30:04 +00:00
const handlePasswordSignIn = async (formData: EmailPasswordFormValues) => {
await authenticationService
.emailLogin(formData)
.then((response) => {
try {
if (response) mutateUser();
} catch (err: any) {
2023-06-16 13:30:04 +00:00
setToastAlert({
type: "error",
title: "Error!",
2023-06-16 13:30:04 +00:00
message:
err?.error ||
2023-06-16 13:30:04 +00:00
"Something went wrong. Please try again later or contact the support team.",
});
}
})
.catch((err) =>
2023-06-16 13:30:04 +00:00
setToastAlert({
type: "error",
title: "Error!",
message:
err?.error ||
"Something went wrong. Please try again later or contact the support team.",
2023-06-16 13:30:04 +00:00
})
);
};
const handleEmailCodeSignIn = async (response: any) => {
try {
if (response) mutateUser();
} catch (err: any) {
setToastAlert({
type: "error",
title: "Error!",
message:
err?.error || "Something went wrong. Please try again later or contact the support team.",
});
}
};
return (
<DefaultLayout>
{isLoading ? (
<div className="grid place-items-center h-screen">
<Spinner />
</div>
) : (
<>
<>
<div className="hidden sm:block sm:fixed border-r-[0.5px] border-custom-border-200 h-screen w-[0.5px] top-0 left-20 lg:left-32" />
<div className="fixed grid place-items-center bg-custom-background-100 sm:py-5 top-11 sm:top-12 left-7 sm:left-16 lg:left-28">
<div className="grid place-items-center bg-custom-background-100">
<div className="h-[30px] w-[30px]">
<Image src={BluePlaneLogoWithoutText} alt="Plane Logo" />
</div>
</div>
</div>
</>
<div className="grid place-items-center h-full overflow-y-auto py-5 px-7">
<div>
{parseInt(process.env.NEXT_PUBLIC_ENABLE_OAUTH || "0") ? (
<>
<h1 className="text-center text-2xl sm:text-2.5xl font-semibold text-custom-text-100">
Sign in to Plane
</h1>
promote: develop to stage-release (#1589) * fix: onboarding invitations overflow (#1575) * fix: onboarding invitations overflow * fix: user avatar in the notification card * style: update graph grid color * fix: no 'Create by me' label coming up (#1573) * feat: added new issue subscriber table * dev: notification model * feat: added CRUD operation for issue subscriber * Revert "feat: added CRUD operation for issue subscriber" This reverts commit b22e0625768f0b096b5898936ace76d6882b0736. * feat: added CRUD operation for issue subscriber * dev: notification models and operations * dev: remove delete endpoint response data * dev: notification endpoints and fix bg worker for saving notifications * feat: added list and unsubscribe function in issue subscriber * dev: filter by snoozed and response update for list and permissions * dev: update issue notifications * dev: notification segregation * dev: update notifications * dev: notification filtering * dev: add issue name in notifications * dev: notification new endpoints * fix: pushing local settings * feat: notification workflow setup and made basic UI * style: improved UX with toast alerts and other interactions refactor: changed classnames according to new theme structure, changed all icons to material icons * feat: showing un-read notification count * feat: not showing 'subscribe' button on issue created by user & assigned to user not showing 'Create by you' for view & guest of the workspace * fix: 'read' -> 'unread' heading, my issue wrong filter * feat: made snooze dropdown & modal feat: switched to calendar * fix: minor ui fixes * feat: snooze modal date/time select * fix: params for read/un-read notification * style: snooze notification modal * fix: no label for 'Create by me' * fix: no label for 'Create by me' * fix: removed console log * fix: tooltip going behind popover --------- Co-authored-by: NarayanBavisetti <narayan3119@gmail.com> Co-authored-by: pablohashescobar <nikhilschacko@gmail.com> Co-authored-by: Aaryan Khandelwal <aaryankhandu123@gmail.com> * style: tooltip on notification header actions (#1577) * style: tooltip on notification header * chore: update tooltip content --------- Co-authored-by: Aaryan Khandelwal <aaryankhandu123@gmail.com> * fix: user migrations for back population (#1578) * fix: total notifications count (#1579) * fix: notification card (#1583) * feat: add new icons package (#1586) * feat: add material icons package * chore: replace issue view icons * chore: notification ordering (#1584) * fix: uuid error when cycle and module updates (#1585) * refactor: height of popover & api fetch call (#1587) * fix: snooze dropdown overflow (#1588) --------- Co-authored-by: Dakshesh Jain <65905942+dakshesh14@users.noreply.github.com> Co-authored-by: NarayanBavisetti <narayan3119@gmail.com> Co-authored-by: pablohashescobar <nikhilschacko@gmail.com> Co-authored-by: Nikhil <118773738+pablohashescobar@users.noreply.github.com>
2023-07-20 09:44:57 +00:00
<div className="flex flex-col divide-y divide-custom-border-200">
<div className="pb-7">
<EmailCodeForm handleSignIn={handleEmailCodeSignIn} />
</div>
promote: develop to stage-release (#1589) * fix: onboarding invitations overflow (#1575) * fix: onboarding invitations overflow * fix: user avatar in the notification card * style: update graph grid color * fix: no 'Create by me' label coming up (#1573) * feat: added new issue subscriber table * dev: notification model * feat: added CRUD operation for issue subscriber * Revert "feat: added CRUD operation for issue subscriber" This reverts commit b22e0625768f0b096b5898936ace76d6882b0736. * feat: added CRUD operation for issue subscriber * dev: notification models and operations * dev: remove delete endpoint response data * dev: notification endpoints and fix bg worker for saving notifications * feat: added list and unsubscribe function in issue subscriber * dev: filter by snoozed and response update for list and permissions * dev: update issue notifications * dev: notification segregation * dev: update notifications * dev: notification filtering * dev: add issue name in notifications * dev: notification new endpoints * fix: pushing local settings * feat: notification workflow setup and made basic UI * style: improved UX with toast alerts and other interactions refactor: changed classnames according to new theme structure, changed all icons to material icons * feat: showing un-read notification count * feat: not showing 'subscribe' button on issue created by user & assigned to user not showing 'Create by you' for view & guest of the workspace * fix: 'read' -> 'unread' heading, my issue wrong filter * feat: made snooze dropdown & modal feat: switched to calendar * fix: minor ui fixes * feat: snooze modal date/time select * fix: params for read/un-read notification * style: snooze notification modal * fix: no label for 'Create by me' * fix: no label for 'Create by me' * fix: removed console log * fix: tooltip going behind popover --------- Co-authored-by: NarayanBavisetti <narayan3119@gmail.com> Co-authored-by: pablohashescobar <nikhilschacko@gmail.com> Co-authored-by: Aaryan Khandelwal <aaryankhandu123@gmail.com> * style: tooltip on notification header actions (#1577) * style: tooltip on notification header * chore: update tooltip content --------- Co-authored-by: Aaryan Khandelwal <aaryankhandu123@gmail.com> * fix: user migrations for back population (#1578) * fix: total notifications count (#1579) * fix: notification card (#1583) * feat: add new icons package (#1586) * feat: add material icons package * chore: replace issue view icons * chore: notification ordering (#1584) * fix: uuid error when cycle and module updates (#1585) * refactor: height of popover & api fetch call (#1587) * fix: snooze dropdown overflow (#1588) --------- Co-authored-by: Dakshesh Jain <65905942+dakshesh14@users.noreply.github.com> Co-authored-by: NarayanBavisetti <narayan3119@gmail.com> Co-authored-by: pablohashescobar <nikhilschacko@gmail.com> Co-authored-by: Nikhil <118773738+pablohashescobar@users.noreply.github.com>
2023-07-20 09:44:57 +00:00
<div className="flex flex-col items-center justify-center gap-4 pt-7 sm:w-[360px] mx-auto overflow-hidden">
<GoogleLoginButton handleSignIn={handleGoogleSignIn} />
<GithubLoginButton handleSignIn={handleGitHubSignIn} />
</div>
</div>
</>
) : (
<EmailPasswordForm onSubmit={handlePasswordSignIn} />
)}
{parseInt(process.env.NEXT_PUBLIC_ENABLE_OAUTH || "0") ? (
<p className="pt-16 text-custom-text-200 text-sm text-center">
By signing up, you agree to the{" "}
<a
href="https://plane.so/terms-and-conditions"
target="_blank"
rel="noopener noreferrer"
className="font-medium underline"
>
Terms & Conditions
</a>
</p>
) : null}
</div>
</div>
</>
)}
</DefaultLayout>
);
2022-11-19 14:21:26 +00:00
};
export default HomePage;