Skip to content

Commit

Permalink
chore: npm prettier
Browse files Browse the repository at this point in the history
  • Loading branch information
huglx committed Nov 11, 2024
1 parent 6dbf406 commit 44133d8
Show file tree
Hide file tree
Showing 9 changed files with 206 additions and 187 deletions.
235 changes: 119 additions & 116 deletions webapp/src/component/security/ChangeAuthProviderView.tsx
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
import {DashboardPage} from "tg.component/layout/DashboardPage";
import {CompactView} from "tg.component/layout/CompactView";
import {Box, styled} from "@mui/material";
import {T, useTranslate} from "@tolgee/react";
import {LINKS} from "tg.constants/links";
import LoadingButton from "tg.component/common/form/LoadingButton";
import {globalContext} from "tg.globalContext/globalActions";
import {useApiMutation, useApiQuery} from "tg.service/http/useQueryApi";
import React from "react";
import {Alert} from "tg.component/common/Alert";
import {TranslatedError} from "tg.translationTools/TranslatedError";
import { DashboardPage } from 'tg.component/layout/DashboardPage';
import { CompactView } from 'tg.component/layout/CompactView';
import { Box, styled } from '@mui/material';
import { T, useTranslate } from '@tolgee/react';
import { LINKS } from 'tg.constants/links';
import LoadingButton from 'tg.component/common/form/LoadingButton';
import { globalContext } from 'tg.globalContext/globalActions';
import { useApiMutation, useApiQuery } from 'tg.service/http/useQueryApi';
import React from 'react';
import { Alert } from 'tg.component/common/Alert';
import { TranslatedError } from 'tg.translationTools/TranslatedError';

const StyledContainer = styled('div')`
padding: 28px 4px 0px 4px;
Expand Down Expand Up @@ -37,118 +37,121 @@ const StyledDescription = styled('div')`
const LOCAL_STORAGE_CHANGE_PROVIDER = 'change_provider';

function getProviderName(accountType?: string, authType?: string) {
if (accountType === "LOCAL") {
return 'username and password';
} else if (accountType === "THIRD_PARTY") {
return authType || 'Third-Party Provider';
}
return 'Unknown Provider';
if (accountType === 'LOCAL') {
return 'username and password';
} else if (accountType === 'THIRD_PARTY') {
return authType || 'Third-Party Provider';
}
return 'Unknown Provider';
}

export function ChangeAuthProviderView() {
const { t } = useTranslate();
const requestIdString = localStorage.getItem(LOCAL_STORAGE_CHANGE_PROVIDER);
const requestId = requestIdString ? Number(requestIdString) : 0;

const { data } = useApiQuery({
url: '/api/public/auth-provider/get-request',
method: 'get',
query: {
requestId
const { t } = useTranslate();
const requestIdString = localStorage.getItem(LOCAL_STORAGE_CHANGE_PROVIDER);
const requestId = requestIdString ? Number(requestIdString) : 0;

const { data } = useApiQuery({
url: '/api/public/auth-provider/get-request',
method: 'get',
query: {
requestId,
},
});

const { error, isSuccess, isLoading, mutate } = useApiMutation({
url: '/api/public/auth-provider/request-change',
method: 'post',
});

const currentProvider = getProviderName(
data?.oldAccountType,
data?.oldAuthType
);
const newProvider = getProviderName(data?.newAccountType, data?.newAuthType);

const confirmChange = () => {
mutate({
content: {
'application/json': {
changeRequestId: requestId,
isConfirmed: true,
},
},
});

const {error, isSuccess, isLoading, mutate } = useApiMutation({
url: '/api/public/auth-provider/request-change',
method: 'post',
if (isSuccess) {
globalContext.actions?.redirectTo(LINKS.LOGIN.build());
}
};

const discardChange = () => {
mutate({
content: {
'application/json': {
changeRequestId: requestId,
isConfirmed: false,
},
},
});

const currentProvider = getProviderName(data?.oldAccountType, data?.oldAuthType);
const newProvider = getProviderName(data?.newAccountType, data?.newAuthType);

const confirmChange = () => {
mutate({
content: {
'application/json': {
changeRequestId: requestId,
isConfirmed: true,
},
},
});

if(isSuccess) {
globalContext.actions?.redirectTo(LINKS.LOGIN.build());
if (isSuccess) {
globalContext.actions?.redirectTo(LINKS.LOGIN.build());
}
};

return (
<DashboardPage>
<CompactView
alerts={
error?.code &&
!isLoading && (
<Alert severity="error">
<TranslatedError code={error.code} />
</Alert>
)
}
};

const discardChange = () => {
mutate({
content: {
'application/json': {
changeRequestId: requestId,
isConfirmed: false,
},
},
});

if(isSuccess) {
globalContext.actions?.redirectTo(LINKS.LOGIN.build());
maxWidth={800}
windowTitle={t('slack_connect_title')}
primaryContent={
<StyledContainer>
<Box display="flex" justifyContent="center"></Box>
<StyledTitle>
<T keyName="change_auth_provider_title" />
</StyledTitle>

<StyledDescription>
<T
keyName="change_auth_provider_description"
params={{
current_provider: currentProvider,
new_provider: newProvider,
b: <strong />,
}}
/>
</StyledDescription>

<Box display="flex" gap={2} mb={1.5}>
<LoadingButton
size="medium"
variant="outlined"
loading={isLoading}
onClick={discardChange}
>
<T keyName="change_auth_provider_cancel" />
</LoadingButton>
<LoadingButton
size="medium"
variant="contained"
color="primary"
loading={isLoading}
onClick={confirmChange}
>
<T keyName="change_auth_provider_confirm" />
</LoadingButton>
</Box>
</StyledContainer>
}
};

return (
<DashboardPage>
<CompactView
alerts={
error?.code &&
!isLoading && (
<Alert severity="error">
<TranslatedError code={error.code} />
</Alert>
)
}
maxWidth={800}
windowTitle={t('slack_connect_title')}
primaryContent={
<StyledContainer>
<Box display="flex" justifyContent="center">
</Box>
<StyledTitle>
<T keyName="change_auth_provider_title" />
</StyledTitle>

<StyledDescription>
<T keyName="change_auth_provider_description"
params={{
current_provider: currentProvider,
new_provider: newProvider,
b: <strong />
}}
/>
</StyledDescription>

<Box display="flex" gap={2} mb={1.5}>
<LoadingButton
size="medium"
variant="outlined"
loading={isLoading}
onClick={discardChange}
>
<T keyName="change_auth_provider_cancel" />
</LoadingButton>
<LoadingButton
size="medium"
variant="contained"
color="primary"
loading={isLoading}
onClick={confirmChange}
>
<T keyName="change_auth_provider_confirm" />
</LoadingButton>
</Box>
</StyledContainer>
}
/>
</DashboardPage>
)
}
/>
</DashboardPage>
);
}
41 changes: 22 additions & 19 deletions webapp/src/component/security/Login/LoginCredentialsForm.tsx
Original file line number Diff line number Diff line change
@@ -1,18 +1,21 @@
import React, {RefObject} from 'react';
import {Button, Link as MuiLink, styled, Typography} from '@mui/material';
import React, { RefObject } from 'react';
import { Button, Link as MuiLink, styled, Typography } from '@mui/material';
import Box from '@mui/material/Box';
import {T, useTranslate} from '@tolgee/react';
import {Link} from 'react-router-dom';
import { T, useTranslate } from '@tolgee/react';
import { Link } from 'react-router-dom';
import LoginIcon from '@mui/icons-material/Login';

import {LINKS} from 'tg.constants/links';
import {useConfig} from 'tg.globalContext/helpers';
import { LINKS } from 'tg.constants/links';
import { useConfig } from 'tg.globalContext/helpers';
import LoadingButton from 'tg.component/common/form/LoadingButton';
import {StandardForm} from 'tg.component/common/form/StandardForm';
import {TextField} from 'tg.component/common/form/fields/TextField';
import {useOAuthServices} from 'tg.hooks/useOAuthServices';
import {useGlobalActions, useGlobalContext,} from 'tg.globalContext/GlobalContext';
import {ApiError} from 'tg.service/http/ApiError';
import { StandardForm } from 'tg.component/common/form/StandardForm';
import { TextField } from 'tg.component/common/form/fields/TextField';
import { useOAuthServices } from 'tg.hooks/useOAuthServices';
import {
useGlobalActions,
useGlobalContext,
} from 'tg.globalContext/GlobalContext';
import { ApiError } from 'tg.service/http/ApiError';

const StyledInputFields = styled('div')`
display: grid;
Expand Down Expand Up @@ -72,23 +75,23 @@ export function LoginCredentialsForm(props: LoginViewCredentialsProps) {
size="medium"
endIcon={
remoteConfig.customLoginLogo ? (
<img
src={remoteConfig.customLoginLogo}
alt="Custom Logo"
style={{ width: 24, height: 24 }}
/>
<img
src={remoteConfig.customLoginLogo}
alt="Custom Logo"
style={{ width: 24, height: 24 }}
/>
) : (
<LoginIcon />
<LoginIcon />
)
}
variant="outlined"
style={{ marginBottom: '0.5rem' }}
color="inherit"
>
{remoteConfig.customLoginText ? (
<span>{remoteConfig.customLoginText}</span>
<span>{remoteConfig.customLoginText}</span>
) : (
<T keyName="login_sso" />
<T keyName="login_sso" />
)}
</Button>
)}
Expand Down
18 changes: 9 additions & 9 deletions webapp/src/component/security/Login/LoginRouter.tsx
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
import {default as React, FunctionComponent} from 'react';
import {Route, Switch} from 'react-router-dom';
import { default as React, FunctionComponent } from 'react';
import { Route, Switch } from 'react-router-dom';

import {LINKS} from 'tg.constants/links';
import { LINKS } from 'tg.constants/links';

import {LoginView} from './LoginView';
import {EmailVerificationHandler} from './EmailVerificationHandler';
import {OAuthRedirectionHandler} from './OAuthRedirectionHandler';
import {PublicOnlyRoute} from 'tg.component/common/PublicOnlyRoute';
import {SsoRedirectionHandler} from 'tg.component/security/Sso/SsoRedirectionHandler';
import {ChangeAuthProviderView} from "tg.component/security/ChangeAuthProviderView";
import { LoginView } from './LoginView';
import { EmailVerificationHandler } from './EmailVerificationHandler';
import { OAuthRedirectionHandler } from './OAuthRedirectionHandler';
import { PublicOnlyRoute } from 'tg.component/common/PublicOnlyRoute';
import { SsoRedirectionHandler } from 'tg.component/security/Sso/SsoRedirectionHandler';
import { ChangeAuthProviderView } from 'tg.component/security/ChangeAuthProviderView';

interface LoginRouterProps {}

Expand Down
12 changes: 6 additions & 6 deletions webapp/src/constants/GlobalValidationSchema.tsx
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
import {DefaultParamType, T, TFnType, TranslationKey} from '@tolgee/react';
import { DefaultParamType, T, TFnType, TranslationKey } from '@tolgee/react';
import * as Yup from 'yup';

import {components} from 'tg.service/apiSchema.generated';
import {organizationService} from '../service/OrganizationService';
import {signUpService} from '../service/SignUpService';
import {checkParamNameIsValid} from '@tginternal/editor';
import {validateObject} from 'tg.fixtures/validateObject';
import { components } from 'tg.service/apiSchema.generated';
import { organizationService } from '../service/OrganizationService';
import { signUpService } from '../service/SignUpService';
import { checkParamNameIsValid } from '@tginternal/editor';
import { validateObject } from 'tg.fixtures/validateObject';

type TFunType = TFnType<DefaultParamType, string, TranslationKey>;

Expand Down
4 changes: 2 additions & 2 deletions webapp/src/constants/links.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -78,8 +78,8 @@ export class LINKS {
);

static CHANGE_AUTH_PROVIDER = Link.ofParent(
LINKS.LOGIN,
'change-auth-provider'
LINKS.LOGIN,
'change-auth-provider'
);

static OPENID_RESPONSE = Link.ofParent(LINKS.LOGIN, 'open-id/auth-callback');
Expand Down
Loading

0 comments on commit 44133d8

Please sign in to comment.