Skip to content

Commit 1702ea0

Browse files
barshathakuribarshathakuri
committed
Remove zendesk and add monday feedback
1 parent 6c9794f commit 1702ea0

File tree

5 files changed

+72
-110
lines changed

5 files changed

+72
-110
lines changed

‎app/Base/index.tsx‎

Lines changed: 47 additions & 77 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1-
import React, { useState, useMemo, useCallback } from 'react';
1+
import React, { useState, useMemo } from 'react';
22
import localforage from 'localforage';
33
import { Router } from 'react-router-dom';
4-
import { init, ErrorBoundary, setUser as setUserOnSentry, withProfiler } from '@sentry/react';
4+
import { init, ErrorBoundary, withProfiler } from '@sentry/react';
55
import { unique, _cs } from '@togglecorp/fujs';
66
import {
77
AlertContainer,
@@ -20,17 +20,10 @@ import 'mapbox-gl/dist/mapbox-gl.css';
2020
import Init from '#base/components/Init';
2121
import browserHistory from '#base/configs/history';
2222
import sentryConfig from '#base/configs/sentry';
23-
import { UserContext, UserContextInterface } from '#base/context/UserContext';
24-
import {
25-
openZendeskFeedback,
26-
setUserOnZendesk,
27-
} from '#base/utils/zendesk';
2823
import { NavbarContext, NavbarContextInterface } from '#base/context/NavbarContext';
2924
import AuthPopup from '#base/components/AuthPopup';
30-
import { sync } from '#base/hooks/useAuthSync';
3125
import Navbar from '#base/components/Navbar';
3226
import Routes from '#base/components/Routes';
33-
import { User } from '#base/types/user';
3427
import {
3528
processDeepUrls,
3629
processDeepOptions,
@@ -72,52 +65,13 @@ if (trackingId) {
7265
}
7366

7467
function Base() {
75-
const [user, setUser] = useState<User | undefined>();
68+
const [mondayFormVisible, setMondayFormVisible] = useState(false);
7669

7770
const [navbarState, setNavbarState] = useState<{
7871
path: string;
7972
visibility: boolean;
8073
}[]>([]);
8174

82-
const authenticated = !!user;
83-
84-
const setUserWithSentryAndZendesk: typeof setUser = useCallback(
85-
(u) => {
86-
if (typeof u === 'function') {
87-
setUser((oldUser) => {
88-
const newUser = u(oldUser);
89-
90-
const sanitizedUser = newUser;
91-
sync(!!sanitizedUser, sanitizedUser?.id);
92-
setUserOnSentry(sanitizedUser ?? null);
93-
setUserOnZendesk(sanitizedUser ?? null);
94-
95-
return newUser;
96-
});
97-
} else {
98-
const sanitizedUser = u;
99-
sync(!!sanitizedUser, sanitizedUser?.id);
100-
setUserOnSentry(sanitizedUser ?? null);
101-
setUserOnZendesk(sanitizedUser ?? null);
102-
setUser(u);
103-
}
104-
},
105-
[setUser],
106-
);
107-
108-
const userContext: UserContextInterface = useMemo(
109-
() => ({
110-
authenticated,
111-
user,
112-
setUser: setUserWithSentryAndZendesk,
113-
}),
114-
[
115-
authenticated,
116-
user,
117-
setUserWithSentryAndZendesk,
118-
],
119-
);
120-
12175
const navbarContext: NavbarContextInterface = useMemo(
12276
() => ({
12377
navbarState,
@@ -219,6 +173,10 @@ function Base() {
219173

220174
const navbarShown = currentNavbarState?.visibility;
221175

176+
const openMondayFeedback = () => {
177+
setMondayFormVisible((prev) => !prev);
178+
};
179+
222180
return (
223181
<div className={styles.base}>
224182
<ErrorBoundary
@@ -233,42 +191,54 @@ function Base() {
233191
>
234192
<RequestContext.Provider value={requestContextValue}>
235193
<ApolloProvider client={apolloClient}>
236-
<UserContext.Provider value={userContext}>
237-
<NavbarContext.Provider value={navbarContext}>
238-
<AlertContext.Provider value={alertContext}>
239-
<AuthPopup />
240-
<AlertContainer className={styles.alertContainer} />
241-
<Router history={browserHistory}>
242-
<Init
243-
className={styles.init}
244-
>
245-
<Navbar
246-
className={_cs(
247-
styles.navbar,
248-
!navbarShown && styles.hidden,
249-
)}
250-
disabled={!navbarShown}
251-
/>
252-
<Routes
253-
className={styles.view}
254-
/>
255-
</Init>
256-
</Router>
257-
</AlertContext.Provider>
258-
</NavbarContext.Provider>
259-
</UserContext.Provider>
194+
<NavbarContext.Provider value={navbarContext}>
195+
<AlertContext.Provider value={alertContext}>
196+
<AuthPopup />
197+
<AlertContainer className={styles.alertContainer} />
198+
<Router history={browserHistory}>
199+
<Init
200+
className={styles.init}
201+
>
202+
<Navbar
203+
className={_cs(
204+
styles.navbar,
205+
!navbarShown && styles.hidden,
206+
)}
207+
disabled={!navbarShown}
208+
/>
209+
<Routes
210+
className={styles.view}
211+
/>
212+
</Init>
213+
</Router>
214+
</AlertContext.Provider>
215+
</NavbarContext.Provider>
260216
</ApolloProvider>
261217
</RequestContext.Provider>
262218
</ErrorBoundary>
263219
<Button
264220
name={undefined}
265-
title="Bug/Feedback?"
221+
title={mondayFormVisible ? 'Close Bug/Feedback?' : 'Bug/Feedback?'}
266222
variant="action"
267-
className={styles.zendeskHelpButton}
268-
onClick={openZendeskFeedback}
223+
className={styles.mondayHelpButton}
224+
onClick={openMondayFeedback}
225+
type="button"
269226
>
270-
Bug / Feedback?
227+
{mondayFormVisible ? 'Close Bug / Feedback?' : 'Bug / Feedback?'}
271228
</Button>
229+
230+
{mondayFormVisible && (
231+
<div className={styles.formOverlay}>
232+
<div className={styles.formContent}>
233+
<iframe
234+
src="https://forms.monday.com/forms/embed/6438474a471702280d54bd27e87f5855?r=apse2"
235+
width="100%"
236+
height="100%"
237+
title="Bug / Feedback Form"
238+
/>
239+
</div>
240+
</div>
241+
)}
272242
</div>
273243
);
274244
}

‎app/Base/styles.css‎

Lines changed: 25 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@
3939
width: 24rem;
4040
}
4141

42-
.zendesk-help-button {
42+
.monday-help-button {
4343
position: fixed;
4444
bottom: var(--dui-spacing-extra-large);
4545
left: 0;
@@ -54,6 +54,30 @@
5454
font-size: var(--dui-font-size-extra-small);
5555
font-weight: var(--dui-font-weight-regular);
5656
}
57+
58+
.formOverlay {
59+
display: flex;
60+
position: fixed;
61+
bottom: var(--dui-spacing-extra-large);
62+
left: var(--dui-spacing-large);
63+
align-items: center;
64+
justify-content: center;
65+
z-index: 1000;
66+
border: var(--dui-width-separator-thin) solid var(--dui-color-separator);
67+
width: 300px;
68+
height: 450px;
69+
}
70+
71+
.formContent {
72+
display: flex;
73+
position: relative;
74+
align-items: center;
75+
justify-content: center;
76+
background-color: white;
77+
width: 100%;
78+
height: 100%;
79+
font-family: 'Source Sans Pro', sans-serif;
80+
}
5781
}
5882

5983
h1, h2, h3, h4, h5, h6 {

‎app/Base/utils/zendesk.d.ts‎

Lines changed: 0 additions & 5 deletions
This file was deleted.

‎app/Base/utils/zendesk.js‎

Lines changed: 0 additions & 17 deletions
This file was deleted.

‎app/index.html‎

Lines changed: 0 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -63,16 +63,6 @@
6363
}
6464
</script>
6565
<!-- End of anti-click-jacking -->
66-
<!-- Start of deephelp Zendesk Widget script -->
67-
<script id="ze-snippet" src="https://static.zdassets.com/ekr/snippet.js?key=c203955c-2d20-4d54-814b-4247caf4340f">
68-
</script>
69-
<script type="text/javascript">
70-
window.zESettings = {};
71-
zE(function() {
72-
zE.hide();
73-
});
74-
</script>
75-
<!-- End of deephelp Zendesk Widget script -->
7666
<!-- Start of Google tag (gtag.js) -->
7767
<% if (process.env.REACT_APP_GA_MEASUREMENT_ID) { %>
7868
<script async src="https://www.googletagmanager.com/gtag/js?id=<%=process.env.REACT_APP_GA_MEASUREMENT_ID%>"></script>

0 commit comments

Comments
 (0)