Skip to content

Commit 7b4c76c

Browse files
committed
feat: update endpoint env variables
1 parent abf311e commit 7b4c76c

File tree

8 files changed

+69
-127
lines changed

8 files changed

+69
-127
lines changed

.env

+2-1
Original file line numberDiff line numberDiff line change
@@ -1 +1,2 @@
1-
ENDPOINT=http://localhost:8000
1+
NEXT_PUBLIC_API_ENDPOINT=http://localhost:8000
2+
NEXT_PUBLIC_FRONTEND_ENDPOINT=http://localhost:3000

components/workflow-nodes/drawer/steps/CompleteHookTrigger.tsx

+15-14
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,9 @@
1-
import { gql } from '@apollo/client';
2-
import { Button, Card, Typography } from 'antd';
3-
import React from 'react';
4-
import { IntegrationTrigger, WorkflowTrigger } from '../../../../graphql';
5-
import { useGetIntegrationTriggerById } from '../../../../src/services/IntegrationTriggerHooks';
6-
import { Loading } from '../../../common/RequestStates/Loading';
7-
import { RequestError } from '../../../common/RequestStates/RequestError';
1+
import { gql } from '@apollo/client'
2+
import { Button, Card, Typography } from 'antd'
3+
import { IntegrationTrigger, WorkflowTrigger } from '../../../../graphql'
4+
import { useGetIntegrationTriggerById } from '../../../../src/services/IntegrationTriggerHooks'
5+
import { Loading } from '../../../common/RequestStates/Loading'
6+
import { RequestError } from '../../../common/RequestStates/RequestError'
87

98
interface Props {
109
integrationTrigger: IntegrationTrigger
@@ -19,31 +18,33 @@ const integrationTriggerFragment = gql`
1918
}
2019
`
2120

22-
export function CompleteHookTrigger (props: Props) {
21+
export function CompleteHookTrigger(props: Props) {
2322
const { integrationTrigger, workflowTrigger, onClose } = props
24-
const {data, loading, error} = useGetIntegrationTriggerById(integrationTriggerFragment, {
23+
const { data, loading, error } = useGetIntegrationTriggerById(integrationTriggerFragment, {
2524
variables: {
26-
id: integrationTrigger.id
27-
}
25+
id: integrationTrigger.id,
26+
},
2827
})
2928

3029
if (loading) {
3130
return <Loading />
3231
}
3332
if (error) {
34-
return <RequestError error={error}/>
33+
return <RequestError error={error} />
3534
}
3635

3736
return (
3837
<>
3938
<Card title="Webhook URL">
40-
{process.env.ENDPOINT}/hooks/{workflowTrigger.hookId}
39+
{process.env.NEXT_PUBLIC_API_ENDPOINT}/hooks/{workflowTrigger.hookId}
4140
</Card>
4241
<div style={{ marginTop: 12 }}>
4342
<Typography.Text type="secondary">{data?.integrationTrigger.hookInstructions}</Typography.Text>
4443
</div>
4544
<div>
46-
<Button type="primary" onClick={() => onClose()} style={{ marginTop: 24 }}>Done</Button>
45+
<Button type="primary" onClick={() => onClose()} style={{ marginTop: 24 }}>
46+
Done
47+
</Button>
4748
</div>
4849
</>
4950
)

next.config.js

-1
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,6 @@ const themeVariables = lessToJS(fs.readFileSync(path.resolve(__dirname, './asset
1010

1111
module.exports = withLess({
1212
env: {
13-
ENDPOINT: process.env.ENDPOINT,
1413
GA_TRACKING_CODE: process.env.GA_TRACKING_CODE,
1514
SLACK_APP_ID: process.env.SLACK_APP_ID,
1615
CRISP_WEBSITE_ID: process.env.CRISP_WEBSITE_ID,

package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
"private": true,
55
"scripts": {
66
"link-types": "rm -f graphql.ts && cp ../backend/generated/graphql.ts graphql.ts",
7-
"dev": "yarn link-types && cross-env NODE_ENV=development PORT=3000 node server.js",
7+
"dev": "yarn link-types && next dev",
88
"build": "next build",
99
"start": "next start",
1010
"type-check": "tsc",

server.js

-62
This file was deleted.

src/apollo.tsx

+32-35
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,17 @@
1-
import React from 'react'
2-
import Head from 'next/head'
31
import { ApolloClient, ApolloProvider, HttpLink, InMemoryCache, NormalizedCacheObject } from '@apollo/react-hooks'
42
import fetch from 'isomorphic-unfetch'
53
import { NextPageContext } from 'next'
4+
import Head from 'next/head'
65
import { destroyCookie, parseCookies, setCookie } from 'nookies'
7-
import { AuthService, TOKEN_COOKIE_NAME, USER_COOKIE_NAME } from './services/AuthService'
8-
import { UserTokens } from './typings/UserTokens'
9-
import ViewerContextProvider from '../components/providers/ViewerContextProvider'
106
import PageLayout from '../components/common/PageLayout/PageLayout'
7+
import ViewerContextProvider from '../components/providers/ViewerContextProvider'
118
import { User } from '../graphql'
9+
import { AuthService, TOKEN_COOKIE_NAME, USER_COOKIE_NAME } from './services/AuthService'
10+
import { UserTokens } from './typings/UserTokens'
1211

1312
let globalApolloClient: ApolloClient<NormalizedCacheObject> | null = null
1413

15-
export function refreshApolloClient () {
14+
export function refreshApolloClient() {
1615
globalApolloClient = null
1716
}
1817

@@ -30,22 +29,14 @@ interface WithApolloProps {
3029
* to a next.js PageTree. Use it by wrapping
3130
* your PageComponent via HOC pattern.
3231
*/
33-
export function withApollo (PageComponent: any, { useLayout = true, ssr = true } = {}) {
34-
const WithApollo = ({
35-
apolloClient,
36-
apolloState,
37-
tokens,
38-
viewer,
39-
...pageProps
40-
}: WithApolloProps) => {
32+
export function withApollo(PageComponent: any, { useLayout = true, ssr = true } = {}) {
33+
const WithApollo = ({ apolloClient, apolloState, tokens, viewer, ...pageProps }: WithApolloProps) => {
4134
const client = apolloClient || initApolloClient(apolloState, tokens)
4235
const pageComponent = <PageComponent {...pageProps} />
4336
return (
4437
<ViewerContextProvider viewer={viewer}>
4538
<ApolloProvider client={client}>
46-
{
47-
viewer && useLayout ? <PageLayout>{pageComponent}</PageLayout> : pageComponent
48-
}
39+
{viewer && useLayout ? <PageLayout>{pageComponent}</PageLayout> : pageComponent}
4940
</ApolloProvider>
5041
</ViewerContextProvider>
5142
)
@@ -73,7 +64,11 @@ export function withApollo (PageComponent: any, { useLayout = true, ssr = true }
7364
try {
7465
tokens = JSON.parse(tokensJson)
7566
} catch {}
76-
if (tokens && tokens.refreshToken && (!tokens.accessTokenExpiration || tokens.accessTokenExpiration < new Date().getTime())) {
67+
if (
68+
tokens &&
69+
tokens.refreshToken &&
70+
(!tokens.accessTokenExpiration || tokens.accessTokenExpiration < new Date().getTime())
71+
) {
7772
if (viewer) {
7873
await refreshCredentials(ctx, viewer.username, tokens)
7974
tokens = JSON.parse(tokensJson)
@@ -110,9 +105,8 @@ export function withApollo (PageComponent: any, { useLayout = true, ssr = true }
110105
...pageProps,
111106
apolloClient,
112107
}}
113-
/>
108+
/>,
114109
)
115-
116110
} catch (error) {
117111
// Prevent Apollo Client GraphQL errors from crashing SSR.
118112
// Handle them in components via the data.error prop:
@@ -145,7 +139,7 @@ export function withApollo (PageComponent: any, { useLayout = true, ssr = true }
145139
* Always creates a new apollo client on the server
146140
* Creates or reuses apollo client in the browser.
147141
*/
148-
export function initApolloClient (initialState: NormalizedCacheObject = {}, tokens?: UserTokens) {
142+
export function initApolloClient(initialState: NormalizedCacheObject = {}, tokens?: UserTokens) {
149143
// Make sure to create a new client for every server-side request so that data
150144
// isn't shared between connections (which would be bad)
151145
if (typeof window === 'undefined') {
@@ -163,18 +157,16 @@ export function initApolloClient (initialState: NormalizedCacheObject = {}, toke
163157
/**
164158
* Creates and configures the ApolloClient
165159
*/
166-
function createApolloClient (initialState: NormalizedCacheObject = {}, tokens?: UserTokens) {
160+
function createApolloClient(initialState: NormalizedCacheObject = {}, tokens?: UserTokens) {
167161
const headers: { [key: string]: string } = {}
168162
if (tokens) {
169163
headers.Authorization = `Bearer ${tokens.accessToken}`
170164
}
171165

172-
const endpoint = typeof window === 'undefined' ? process.env.ENDPOINT! : ''
173-
174166
return new ApolloClient({
175167
ssrMode: typeof window === 'undefined', // Disables forceFetch on the server (so queries are only run once)
176168
link: new HttpLink({
177-
uri: `${endpoint}/graphql`, // Server URL (must be absolute)
169+
uri: `${process.env.NEXT_PUBLIC_API_ENDPOINT}/graphql`, // Server URL (must be absolute)
178170
credentials: 'same-origin', // Additional fetch() options like `credentials` or `headers`
179171
fetch,
180172
headers,
@@ -186,14 +178,14 @@ function createApolloClient (initialState: NormalizedCacheObject = {}, tokens?:
186178
return node.username || node.id
187179
}
188180
return node.id
189-
}
181+
},
190182
}).restore(initialState),
191183
})
192184
}
193185

194-
async function refreshCredentials (ctx: ApolloPageContext, username: string, tokens: UserTokens) {
195-
const endpoint = typeof window === 'undefined' ? process.env.ENDPOINT! : ''
196-
const res = await fetch(`${endpoint}/api/v1/auth/token`, { // TODO
186+
async function refreshCredentials(ctx: ApolloPageContext, username: string, tokens: UserTokens) {
187+
const res = await fetch(`${process.env.NEXT_PUBLIC_API_ENDPOINT}/api/v1/auth/token`, {
188+
// TODO
197189
method: 'POST',
198190
headers: {
199191
Accept: 'application/json',
@@ -202,15 +194,20 @@ async function refreshCredentials (ctx: ApolloPageContext, username: string, tok
202194
body: JSON.stringify({
203195
username,
204196
refreshToken: tokens.refreshToken,
205-
})
197+
}),
206198
})
207199

208200
if (res.status >= 200 && res.status < 300) {
209-
setCookie(ctx, TOKEN_COOKIE_NAME, JSON.stringify({
210-
...tokens,
211-
...(await res.json()),
212-
__typename: undefined,
213-
}), {})
201+
setCookie(
202+
ctx,
203+
TOKEN_COOKIE_NAME,
204+
JSON.stringify({
205+
...tokens,
206+
...(await res.json()),
207+
__typename: undefined,
208+
}),
209+
{},
210+
)
214211
} else if (res.status === 401) {
215212
// invalid refresh token, remove all cookies
216213
destroyCookie(ctx, USER_COOKIE_NAME)

src/services/AuthService.ts

+1-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import { NextPageContext } from 'next'
22
import { parseCookies } from 'nookies'
33
import { User } from '../../graphql'
4-
import { isBrowser } from '../utils/environment'
54

65
export const TOKEN_COOKIE_NAME = 'cj-token'
76
export const USER_COOKIE_NAME = 'cj-user'
@@ -10,7 +9,7 @@ export class AuthService {
109
readonly endpoint: string
1110

1211
constructor(readonly ctx?: NextPageContext) {
13-
this.endpoint = isBrowser ? '' : process.env.ENDPOINT!
12+
this.endpoint = process.env.NEXT_PUBLIC_API_ENDPOINT!
1413
}
1514

1615
getCookies() {

src/utils/html.utils.tsx

+18-11
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,28 @@
1-
2-
export function getHeadMetatags (
3-
{ path, title, description, image = '/logo.svg' }: { path: string; title: string; description: string; image?: string }
4-
) {
5-
const url = process.env.ENDPOINT + path
1+
export function getHeadMetatags({
2+
path,
3+
title,
4+
description,
5+
image = '/logo.svg',
6+
}: {
7+
path: string
8+
title: string
9+
description: string
10+
image?: string
11+
}) {
12+
const url = process.env.NEXT_PUBLIC_FRONTEND_ENDPOINT + path
613
let imageUrl = image
714
if (imageUrl?.startsWith('/')) {
8-
imageUrl = process.env.ENDPOINT + image
15+
imageUrl = process.env.NEXT_PUBLIC_FRONTEND_ENDPOINT + image
916
}
1017

1118
return (
1219
<>
1320
<title>{title}</title>
14-
<meta name="description" content={description}/>
15-
<meta property="og:title" content={title}/>
16-
<meta property="og:description" content={description}/>
17-
<meta property="og:image" content={imageUrl}/>
18-
<link rel="canonical" href={url}/>
21+
<meta name="description" content={description} />
22+
<meta property="og:title" content={title} />
23+
<meta property="og:description" content={description} />
24+
<meta property="og:image" content={imageUrl} />
25+
<link rel="canonical" href={url} />
1926
<meta property="og:type" content="website" />
2027
</>
2128
)

0 commit comments

Comments
 (0)