cal.pub0.org/apps/web/pages/settings/security/impersonation.tsx

109 lines
3.2 KiB
TypeScript
Raw Normal View History

import type { GetServerSidePropsContext } from "next";
2022-10-19 09:33:40 +00:00
import { useForm } from "react-hook-form";
import { getLayout } from "@calcom/features/settings/layouts/SettingsLayout";
2022-10-19 09:33:40 +00:00
import { useLocale } from "@calcom/lib/hooks/useLocale";
import { trpc } from "@calcom/trpc/react";
import { Button, Form, Label, Meta, showToast, Skeleton, Switch } from "@calcom/ui";
2022-10-19 09:33:40 +00:00
import PageWrapper from "@components/PageWrapper";
Improve multilingualism and fix search routes (#5334) * fixed search routes * made static text multilingual and fixed german translations # Conflicts: # apps/web/components/availability/Schedule.tsx * delete empty file created by fixing merge conflicts * fixing TextField placeholder by passing attendeeName and fixed json variable * Using useLocal to modify static text to make it multilingual, and passing the correct variables for brand and mail * seperated whitelabel and improved translations * added missing translation * added missing translation for webhooks * Updated AdminAppsView with dynamic translations. Added translations for german and english files only. * changed back to one liner * updated german and english translations for impersonation.tsx * updated german and english translations for impersonation.tsx and users.tsx. added missing german translation for timeformat_profile_hint * updated german and english translations for team-billing-view.tsx * updated german and english translations for LicenseRequired.tsx * updated routes for profile and avatar * yarn.lock updated from newer changes * Revert " yarn.lock updated from newer changes" This reverts commit efd9a90bf774371a331861e4fb441ab4f4d0b7fd. * sanitize dangerouslySetInnerHTML to prevent xss attacks * tried to fix window title flicker * changed ssdInit to ssrInit for getServerSideProps. Serverside translation works but current route still set as a window title * flicker with route in window title is caused here. It is not necessary to check if isPublic and session is false because it already gets checked in useRedirectToLoginIfUnauthenticated hook. * fixed window title translation flicker for availability page * fixed window title translation flicker for teams page * fixed window title translation flicker for workflow page * fixed error that div may not be rendered within p element * fixed window title translation flicker for booking page * fixed window title translation flicker by adding getServerSideProps * Only set HeadSeo if an page title exists. If window title is set by the Meta component, shell is causing a flicker because it overwrites the title which is set by Meta. It is a problem especially for settings pages. * fixed window title translation flicker by adding the Meta component to the skeleton * fixed condition * removed condition and added withoutSeo for settings pages * using translations for create team page further fixed flicker for window title * fixed flicker for window title for event-type creation page * fixed flicker for window title for availability creation page * fixed flicker for window title for sso page * updated conferencing en translation * added meta.CTA back it was mistakenly removed * fixed flicker for workflows page * fixed missing variable * Update packages/ui/v2/core/Shell.tsx * Delete index.tsx * Update sso.tsx * Updates subdmoules Co-authored-by: maxi <maximilian.oehrlein@clicksports.de> Co-authored-by: Peer Richelsen <peeroke@gmail.com> Co-authored-by: Omar López <zomars@me.com>
2022-12-07 20:53:44 +00:00
import { ssrInit } from "@server/lib/ssr";
2022-10-19 09:33:40 +00:00
const ProfileImpersonationView = () => {
const { t } = useLocale();
const utils = trpc.useContext();
const { data: user } = trpc.viewer.me.useQuery();
const mutation = trpc.viewer.updateProfile.useMutation({
2022-10-19 09:33:40 +00:00
onSuccess: () => {
showToast(t("profile_updated_successfully"), "success");
reset(getValues());
2022-10-19 09:33:40 +00:00
},
onSettled: () => {
utils.viewer.me.invalidate();
},
onMutate: async ({ disableImpersonation }) => {
await utils.viewer.me.cancel();
const previousValue = utils.viewer.me.getData();
if (previousValue && disableImpersonation) {
utils.viewer.me.setData(undefined, { ...previousValue, disableImpersonation });
}
return { previousValue };
},
onError: (error, variables, context) => {
if (context?.previousValue) {
utils.viewer.me.setData(undefined, context.previousValue);
}
2022-10-19 09:33:40 +00:00
showToast(`${t("error")}, ${error.message}`, "error");
},
});
const formMethods = useForm<{ disableImpersonation: boolean }>({
defaultValues: {
disableImpersonation: user?.disableImpersonation,
},
});
const {
formState: { isSubmitting, isDirty },
2022-10-19 09:33:40 +00:00
setValue,
reset,
getValues,
watch,
2022-10-19 09:33:40 +00:00
} = formMethods;
const isDisabled = isSubmitting || !isDirty;
2022-10-19 09:33:40 +00:00
return (
<>
Improve multilingualism and fix search routes (#5334) * fixed search routes * made static text multilingual and fixed german translations # Conflicts: # apps/web/components/availability/Schedule.tsx * delete empty file created by fixing merge conflicts * fixing TextField placeholder by passing attendeeName and fixed json variable * Using useLocal to modify static text to make it multilingual, and passing the correct variables for brand and mail * seperated whitelabel and improved translations * added missing translation * added missing translation for webhooks * Updated AdminAppsView with dynamic translations. Added translations for german and english files only. * changed back to one liner * updated german and english translations for impersonation.tsx * updated german and english translations for impersonation.tsx and users.tsx. added missing german translation for timeformat_profile_hint * updated german and english translations for team-billing-view.tsx * updated german and english translations for LicenseRequired.tsx * updated routes for profile and avatar * yarn.lock updated from newer changes * Revert " yarn.lock updated from newer changes" This reverts commit efd9a90bf774371a331861e4fb441ab4f4d0b7fd. * sanitize dangerouslySetInnerHTML to prevent xss attacks * tried to fix window title flicker * changed ssdInit to ssrInit for getServerSideProps. Serverside translation works but current route still set as a window title * flicker with route in window title is caused here. It is not necessary to check if isPublic and session is false because it already gets checked in useRedirectToLoginIfUnauthenticated hook. * fixed window title translation flicker for availability page * fixed window title translation flicker for teams page * fixed window title translation flicker for workflow page * fixed error that div may not be rendered within p element * fixed window title translation flicker for booking page * fixed window title translation flicker by adding getServerSideProps * Only set HeadSeo if an page title exists. If window title is set by the Meta component, shell is causing a flicker because it overwrites the title which is set by Meta. It is a problem especially for settings pages. * fixed window title translation flicker by adding the Meta component to the skeleton * fixed condition * removed condition and added withoutSeo for settings pages * using translations for create team page further fixed flicker for window title * fixed flicker for window title for event-type creation page * fixed flicker for window title for availability creation page * fixed flicker for window title for sso page * updated conferencing en translation * added meta.CTA back it was mistakenly removed * fixed flicker for workflows page * fixed missing variable * Update packages/ui/v2/core/Shell.tsx * Delete index.tsx * Update sso.tsx * Updates subdmoules Co-authored-by: maxi <maximilian.oehrlein@clicksports.de> Co-authored-by: Peer Richelsen <peeroke@gmail.com> Co-authored-by: Omar López <zomars@me.com>
2022-12-07 20:53:44 +00:00
<Meta title={t("impersonation")} description={t("impersonation_description")} />
2022-10-19 09:33:40 +00:00
<Form
form={formMethods}
handleSubmit={({ disableImpersonation }) => {
mutation.mutate({ disableImpersonation });
}}>
<div className="flex space-x-3">
<Switch
onCheckedChange={(e) => {
setValue("disableImpersonation", !e, { shouldDirty: true });
2022-10-19 09:33:40 +00:00
}}
fitToHeight={true}
checked={!watch("disableImpersonation")}
2022-10-19 09:33:40 +00:00
/>
<div className="flex flex-col">
<Skeleton as={Label} className="text-emphasis text-sm font-semibold leading-none">
2022-10-19 09:33:40 +00:00
{t("user_impersonation_heading")}
</Skeleton>
<Skeleton as="p" className="text-default -mt-2 text-sm leading-normal">
2022-10-19 09:33:40 +00:00
{t("user_impersonation_description")}
</Skeleton>
</div>
</div>
<Button
color="primary"
loading={mutation.isLoading}
className="mt-8"
type="submit"
disabled={isDisabled}>
2022-10-19 09:33:40 +00:00
{t("update")}
</Button>
</Form>
</>
);
};
ProfileImpersonationView.getLayout = getLayout;
ProfileImpersonationView.PageWrapper = PageWrapper;
2022-10-19 09:33:40 +00:00
Improve multilingualism and fix search routes (#5334) * fixed search routes * made static text multilingual and fixed german translations # Conflicts: # apps/web/components/availability/Schedule.tsx * delete empty file created by fixing merge conflicts * fixing TextField placeholder by passing attendeeName and fixed json variable * Using useLocal to modify static text to make it multilingual, and passing the correct variables for brand and mail * seperated whitelabel and improved translations * added missing translation * added missing translation for webhooks * Updated AdminAppsView with dynamic translations. Added translations for german and english files only. * changed back to one liner * updated german and english translations for impersonation.tsx * updated german and english translations for impersonation.tsx and users.tsx. added missing german translation for timeformat_profile_hint * updated german and english translations for team-billing-view.tsx * updated german and english translations for LicenseRequired.tsx * updated routes for profile and avatar * yarn.lock updated from newer changes * Revert " yarn.lock updated from newer changes" This reverts commit efd9a90bf774371a331861e4fb441ab4f4d0b7fd. * sanitize dangerouslySetInnerHTML to prevent xss attacks * tried to fix window title flicker * changed ssdInit to ssrInit for getServerSideProps. Serverside translation works but current route still set as a window title * flicker with route in window title is caused here. It is not necessary to check if isPublic and session is false because it already gets checked in useRedirectToLoginIfUnauthenticated hook. * fixed window title translation flicker for availability page * fixed window title translation flicker for teams page * fixed window title translation flicker for workflow page * fixed error that div may not be rendered within p element * fixed window title translation flicker for booking page * fixed window title translation flicker by adding getServerSideProps * Only set HeadSeo if an page title exists. If window title is set by the Meta component, shell is causing a flicker because it overwrites the title which is set by Meta. It is a problem especially for settings pages. * fixed window title translation flicker by adding the Meta component to the skeleton * fixed condition * removed condition and added withoutSeo for settings pages * using translations for create team page further fixed flicker for window title * fixed flicker for window title for event-type creation page * fixed flicker for window title for availability creation page * fixed flicker for window title for sso page * updated conferencing en translation * added meta.CTA back it was mistakenly removed * fixed flicker for workflows page * fixed missing variable * Update packages/ui/v2/core/Shell.tsx * Delete index.tsx * Update sso.tsx * Updates subdmoules Co-authored-by: maxi <maximilian.oehrlein@clicksports.de> Co-authored-by: Peer Richelsen <peeroke@gmail.com> Co-authored-by: Omar López <zomars@me.com>
2022-12-07 20:53:44 +00:00
export const getServerSideProps = async (context: GetServerSidePropsContext) => {
const ssr = await ssrInit(context);
await ssr.viewer.me.prefetch();
Improve multilingualism and fix search routes (#5334) * fixed search routes * made static text multilingual and fixed german translations # Conflicts: # apps/web/components/availability/Schedule.tsx * delete empty file created by fixing merge conflicts * fixing TextField placeholder by passing attendeeName and fixed json variable * Using useLocal to modify static text to make it multilingual, and passing the correct variables for brand and mail * seperated whitelabel and improved translations * added missing translation * added missing translation for webhooks * Updated AdminAppsView with dynamic translations. Added translations for german and english files only. * changed back to one liner * updated german and english translations for impersonation.tsx * updated german and english translations for impersonation.tsx and users.tsx. added missing german translation for timeformat_profile_hint * updated german and english translations for team-billing-view.tsx * updated german and english translations for LicenseRequired.tsx * updated routes for profile and avatar * yarn.lock updated from newer changes * Revert " yarn.lock updated from newer changes" This reverts commit efd9a90bf774371a331861e4fb441ab4f4d0b7fd. * sanitize dangerouslySetInnerHTML to prevent xss attacks * tried to fix window title flicker * changed ssdInit to ssrInit for getServerSideProps. Serverside translation works but current route still set as a window title * flicker with route in window title is caused here. It is not necessary to check if isPublic and session is false because it already gets checked in useRedirectToLoginIfUnauthenticated hook. * fixed window title translation flicker for availability page * fixed window title translation flicker for teams page * fixed window title translation flicker for workflow page * fixed error that div may not be rendered within p element * fixed window title translation flicker for booking page * fixed window title translation flicker by adding getServerSideProps * Only set HeadSeo if an page title exists. If window title is set by the Meta component, shell is causing a flicker because it overwrites the title which is set by Meta. It is a problem especially for settings pages. * fixed window title translation flicker by adding the Meta component to the skeleton * fixed condition * removed condition and added withoutSeo for settings pages * using translations for create team page further fixed flicker for window title * fixed flicker for window title for event-type creation page * fixed flicker for window title for availability creation page * fixed flicker for window title for sso page * updated conferencing en translation * added meta.CTA back it was mistakenly removed * fixed flicker for workflows page * fixed missing variable * Update packages/ui/v2/core/Shell.tsx * Delete index.tsx * Update sso.tsx * Updates subdmoules Co-authored-by: maxi <maximilian.oehrlein@clicksports.de> Co-authored-by: Peer Richelsen <peeroke@gmail.com> Co-authored-by: Omar López <zomars@me.com>
2022-12-07 20:53:44 +00:00
return {
props: {
trpcState: ssr.dehydrate(),
},
};
};
2022-10-19 09:33:40 +00:00
export default ProfileImpersonationView;