Skip to content

Commit 6d3af67

Browse files
CristhianF7Cristhian Fernández
CristhianF7
and
Cristhian Fernández
authored
feat: api and url transform (#47)
Co-authored-by: Cristhian Fernández <[email protected]>
1 parent ac4742a commit 6d3af67

File tree

7 files changed

+60
-58
lines changed

7 files changed

+60
-58
lines changed

‎.env.cluster.example‎

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,20 +3,16 @@ CLUSTER_NAME=Kubefirst
33
GITHUB_HOST=github.com
44
GITHUB_OWNER=Kubefirst
55
HOSTED_ZONE_NAME=your-company.io
6-
76
ARGO_WORKFLOWS_URL=https://argo.your-company.io
87
VAULT_URL=https://vault.your-company.io
98
ARGO_CD_URL=https://argocd.your-company.io
109
ATLANTIS_URL=https://atlantis.your-company.io
11-
1210
METAPHOR_DEV=https://metaphor-development.your-company.io
1311
METAPHOR_GO_DEV=https://metaphor-go-development.your-company.io
1412
METAPHOR_FRONT_DEV=https://metaphor-frontend-development.your-company.io
15-
1613
METAPHOR_STAGING=https://metaphor-staging.your-company.io
1714
METAPHOR_GO_STAGING=https://metaphor-go-staging.your-company.io
1815
METAPHOR_FRONT_STAGING=https://metaphor-frontend-staging.your-company.io
19-
2016
METAPHOR_PROD=https://metaphor-production.your-company.io
2117
METAPHOR_GO_PROD=https://metaphor-go-production.your-company.io
2218
METAPHOR_FRONT_PROD=https://metaphor-frontend-production.your-company.io

‎.env.local.example‎

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,15 +6,12 @@ ARGO_WORKFLOWS_URL=http://localhost:2746
66
VAULT_URL=http://localhost:8200
77
ARGO_CD_URL=http://localhost:8080
88
ATLANTIS_URL=http://localhost:4141
9-
109
METAPHOR_DEV=http://localhost:3000
1110
METAPHOR_GO_DEV=http://localhost:5000
1211
METAPHOR_FRONT_DEV=http://localhost:4000
13-
1412
METAPHOR_STAGING=http://localhost:3001
1513
METAPHOR_GO_STAGING=http://localhost:5001
1614
METAPHOR_FRONT_STAGING=http://localhost:4001
17-
1815
METAPHOR_PROD=http://localhost:3002
1916
METAPHOR_GO_PROD=http://localhost:5002
2017
METAPHOR_FRONT_PROD=http://localhost:4002

‎src/actions/config.action.ts‎

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,9 @@
11
import { createAsyncThunk } from '@reduxjs/toolkit';
2-
import { Config } from 'src/types/config';
32

4-
import { endpoints } from '../api/internalApi';
3+
import { setConfigs } from '../slices/config.slice';
54

6-
const { getConfigs: getConfigsAPI } = endpoints;
5+
export const getConfigs = createAsyncThunk('config/getConfigs', async (_, { dispatch }) => {
6+
const configValues = window?.__env__ || {};
77

8-
export const getConfigs = createAsyncThunk<Config>('config/getConfigs', async (_, { dispatch }) => {
9-
const configValues = await getConfigsAPI.initiate({});
10-
return dispatch(configValues).unwrap();
8+
return await dispatch(setConfigs(configValues));
119
});

‎src/components/card/index.tsx‎

Lines changed: 30 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,10 @@ export interface ICardProps {
1818
}
1919

2020
const LOCAL_URL_TRANSFORMS: { [key: string]: string } = {
21-
['http://localhost:8200/ui/vault/auth?with=userpass']: 'http://localhost:8200',
21+
'http://localhost:8200/ui/vault/auth?with=userpass': 'http://localhost:8200',
22+
'http://localhost:8080/applications/argo-workflows-cwfts':
23+
'http://localhost:8080/applications/argo-cwft-components',
24+
'http://localhost:8080/applications/argocd': 'http://localhost:8080/applications/argo',
2225
};
2326

2427
const Card: FunctionComponent<ICardProps> = ({
@@ -28,12 +31,20 @@ const Card: FunctionComponent<ICardProps> = ({
2831
hostedZoneName = '',
2932
logo,
3033
}) => {
31-
const transformLocalValues = (domain: string) => {
34+
const transformLocalValues = (domain: string): string => {
3235
const transformedDomain = LOCAL_URL_TRANSFORMS[domain];
3336

3437
return transformedDomain || domain;
3538
};
3639

40+
const transformLocalTagUrl = (url: string): string => {
41+
if (url && url.includes('//localhost')) {
42+
return transformLocalValues(url);
43+
}
44+
45+
return url;
46+
};
47+
3748
const getHostname = useCallback(
3849
(domain: string) => {
3950
if (domain && domain.includes('//localhost')) {
@@ -57,25 +68,30 @@ const Card: FunctionComponent<ICardProps> = ({
5768
return (
5869
<Container data-testid="card-component">
5970
<CardContent>
60-
<>
61-
<Image src={logo} />
62-
<TextHeader>
63-
<Text type={TYPES.TITLE}>{appName}</Text>
64-
</TextHeader>
65-
{links.map((domain) => (
71+
<Image src={logo} />
72+
<TextHeader>
73+
<Text type={TYPES.TITLE}>{appName}</Text>
74+
</TextHeader>
75+
{links &&
76+
links.map((domain) => (
6677
<Link href={domain} target="_blank" key={domain}>
6778
<Text type={TYPES.DISABLED}>{getHostname(domain)}</Text>
6879
<FiExternalLink />
6980
</Link>
7081
))}
71-
</>
7282
</CardContent>
7383
<Tags>
74-
{tags.map(({ value, url, backgroundColor, color }) => (
75-
<Tag key={value} backgroundColor={backgroundColor} color={color} url={url}>
76-
{value}
77-
</Tag>
78-
))}
84+
{tags &&
85+
tags.map(({ value, url, backgroundColor, color }) => (
86+
<Tag
87+
key={value}
88+
backgroundColor={backgroundColor}
89+
color={color}
90+
url={transformLocalTagUrl(url)}
91+
>
92+
{value}
93+
</Tag>
94+
))}
7995
</Tags>
8096
</Container>
8197
);

‎src/selectors/config.selector.ts‎

Lines changed: 11 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import { isEmpty } from 'lodash';
21
import { createSelector } from '@reduxjs/toolkit';
32

43
import { IConfigState } from '../slices/config.slice';
@@ -9,7 +8,7 @@ import { GIT_PROVIDERS } from '../enums/utils';
98
const configSelector = (state: RootState): IConfigState => state.config;
109

1110
export const selectConfigCardValues = () =>
12-
createSelector(configSelector, ({ configs: configValues }) => {
11+
createSelector(configSelector, ({ configs }) => {
1312
const {
1413
HOSTED_ZONE_NAME,
1514
GITHUB_HOST,
@@ -27,7 +26,7 @@ export const selectConfigCardValues = () =>
2726
METAPHOR_PROD,
2827
METAPHOR_GO_PROD,
2928
METAPHOR_FRONT_PROD,
30-
} = !isEmpty(configValues) ? configValues : window.__env__ || {};
29+
} = configs;
3130

3231
const params: CardsContentProps = {
3332
gitProvider: GITHUB_OWNER ? GIT_PROVIDERS.GITHUB : GIT_PROVIDERS.GITLAB,
@@ -39,18 +38,18 @@ export const selectConfigCardValues = () =>
3938
argoUrl: ARGO_CD_URL,
4039
atlantisUrl: ATLANTIS_URL,
4140
metaphor: {
42-
goUrl: `${METAPHOR_GO_DEV}/app`,
43-
nodeJsUrl: `${METAPHOR_DEV}/app`,
41+
goUrl: METAPHOR_GO_DEV && `${METAPHOR_GO_DEV}/app`,
42+
nodeJsUrl: METAPHOR_DEV && `${METAPHOR_DEV}/app`,
4443
reactUrl: METAPHOR_FRONT_DEV,
4544
},
4645
metaphorStaging: {
47-
goUrl: `${METAPHOR_GO_STAGING}/app`,
48-
nodeJsUrl: `${METAPHOR_STAGING}/app`,
46+
goUrl: METAPHOR_GO_STAGING && `${METAPHOR_GO_STAGING}/app`,
47+
nodeJsUrl: METAPHOR_STAGING && `${METAPHOR_STAGING}/app`,
4948
reactUrl: METAPHOR_FRONT_STAGING,
5049
},
5150
metaphorProduction: {
52-
goUrl: `${METAPHOR_GO_PROD}/app`,
53-
nodeJsUrl: `${METAPHOR_PROD}/app`,
51+
goUrl: METAPHOR_GO_PROD && `${METAPHOR_GO_PROD}/app`,
52+
nodeJsUrl: METAPHOR_PROD && `${METAPHOR_PROD}/app`,
5453
reactUrl: METAPHOR_FRONT_PROD,
5554
},
5655
};
@@ -59,19 +58,10 @@ export const selectConfigCardValues = () =>
5958
});
6059

6160
export const selectConfigClusterName = () =>
62-
createSelector(
63-
configSelector,
64-
({ configs }) => configs?.CLUSTER_NAME || window.__env__?.CLUSTER_NAME,
65-
);
61+
createSelector(configSelector, ({ configs }) => configs?.CLUSTER_NAME);
6662

6763
export const selectConfigAdminEmail = () =>
68-
createSelector(
69-
configSelector,
70-
({ configs }) => configs?.ADMIN_EMAIL || window.__env__?.ADMIN_EMAIL,
71-
);
64+
createSelector(configSelector, ({ configs }) => configs?.ADMIN_EMAIL);
7265

7366
export const selectHostedZoneName = () =>
74-
createSelector(
75-
configSelector,
76-
({ configs }) => configs?.HOSTED_ZONE_NAME || window.__env__?.HOSTED_ZONE_NAME,
77-
);
67+
createSelector(configSelector, ({ configs }) => configs?.HOSTED_ZONE_NAME);

‎src/slices/config.slice.ts‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,25 @@
1-
import { createSlice } from '@reduxjs/toolkit';
1+
import { createSlice, PayloadAction } from '@reduxjs/toolkit';
22

33
import { Config } from '../types/config';
4-
import { getConfigs } from '../actions/config.action';
54

65
export interface IConfigState {
7-
configs?: Config;
6+
configs: Config;
87
}
98

109
export const initialState: IConfigState = {
11-
configs: undefined,
10+
configs: {} as Config,
1211
};
1312

1413
const configSlice = createSlice({
1514
name: 'configs',
1615
initialState,
17-
reducers: {},
18-
extraReducers(builder) {
19-
builder.addCase(getConfigs.fulfilled, (state, action) => {
16+
reducers: {
17+
setConfigs(state, action: PayloadAction<Config>) {
2018
state.configs = action.payload;
21-
});
19+
},
2220
},
2321
});
2422

23+
export const { setConfigs } = configSlice.actions;
24+
2525
export default configSlice.reducer;

‎src/utils/cards.ts‎

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -77,6 +77,11 @@ export const buildCardsContent = ({
7777
metaphorStaging,
7878
metaphorProduction,
7979
}: CardsContentProps) => {
80+
const argoUrlAuth =
81+
argoUrl && argoUrl.includes('//localhost')
82+
? argoUrl
83+
: `${argoUrl}/auth/login?return_url=${encodeURIComponent(`${argoUrl}/applications/`)}`;
84+
8085
const gitTile =
8186
gitProvider === GIT_PROVIDERS.GITHUB
8287
? {
@@ -103,12 +108,12 @@ export const buildCardsContent = ({
103108
{
104109
appName: 'Argo CD',
105110
tags: [buildDocsTag(`${gitProvider}/argocd.html`), buildArgoCDTag(argoUrl, 'argocd')],
106-
links: [argoUrl],
111+
links: [argoUrlAuth],
107112
logo: ArgoCDLogo,
108113
},
109114
{
110115
appName: 'Argo Workflows',
111-
tags: [buildDocsTag('tooling/argo.html'), buildArgoCDTag(argoUrl, 'argo-workflows-cwfts')],
116+
tags: [buildDocsTag('argo.html', 'tooling'), buildArgoCDTag(argoUrl, 'argo-workflows-cwfts')],
112117
links: [argoWorkflowsUrl],
113118
logo: ArgoCDLogo,
114119
},

0 commit comments

Comments
 (0)