Skip to content

Commit 8d4aabe

Browse files
Rodri77Rodri77
authored
Memo main component, improve initial loader bg and bump version (#283)
* Memo main component, improve initial loader bg and bump version * Add spacing for no connections yet message * Update verticals to better fit integrations and clean other * Update docs
1 parent a126470 commit 8d4aabe

File tree

13 files changed

+178
-150
lines changed

13 files changed

+178
-150
lines changed

‎connectors/connector-discord/def.ts

+1
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@ export const discordDef = {
1717
metadata: {
1818
displayName: 'Discord',
1919
stage: 'beta',
20+
verticals: ['messaging'],
2021
logoUrl: '/_assets/logo-discord.svg',
2122
nangoProvider: 'discord',
2223
},

‎connectors/connector-github/def.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ export const githubDef = {
2424
metadata: {
2525
displayName: 'GitHub',
2626
stage: 'beta',
27-
verticals: ['other'],
27+
verticals: ['developer-tools'],
2828
logoUrl: '/_assets/logo-github.svg',
2929
nangoProvider: 'github',
3030
},

‎connectors/connector-gong/def.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ export const gongDef = {
2424
metadata: {
2525
displayName: 'Gong',
2626
stage: 'beta',
27-
verticals: ['other'],
27+
verticals: ['sales-enablement'],
2828
logoUrl: '/_assets/logo-gong.svg',
2929
nangoProvider: 'gong',
3030
},

‎connectors/connector-intercom/def.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ export const intercomDef = {
2424
metadata: {
2525
displayName: 'Intercom',
2626
stage: 'beta',
27-
verticals: ['other'],
27+
verticals: ['communication'],
2828
logoUrl: '/_assets/logo-intercom.svg',
2929
nangoProvider: 'intercom',
3030
},

‎connectors/connector-jira/def.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ export const jiraDef = {
2424
metadata: {
2525
displayName: 'Jira',
2626
stage: 'beta',
27-
verticals: ['other'],
27+
verticals: ['ticketing'],
2828
logoUrl: '/_assets/logo-jira.svg',
2929
nangoProvider: 'jira',
3030
},

‎connectors/connector-kustomer/def.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ export const kustomerDef = {
2424
metadata: {
2525
displayName: 'Kustomer',
2626
stage: 'beta',
27-
verticals: ['other'],
27+
verticals: ['communication'],
2828
logoUrl: '/_assets/logo-kustomer.svg',
2929
// TODO: Update opensdks NangoProvider type to include kustomer
3030
// @ts-expect-error

‎connectors/connector-linear/def.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ export const linearDef = {
2424
metadata: {
2525
displayName: 'Linear',
2626
stage: 'beta',
27-
verticals: ['other'],
27+
verticals: ['ticketing'],
2828
logoUrl: '/_assets/logo-linear.svg',
2929
nangoProvider: 'linear',
3030
},

‎kits/cdk/verticals.ts

+23-20
Original file line numberDiff line numberDiff line change
@@ -12,26 +12,7 @@ interface VerticalInfo {
1212
// Also maybe should be distributed in a metadata file associated with each unified api
1313
// impl.
1414
const _VERTICAL_BY_KEY = {
15-
banking: {},
1615
accounting: {},
17-
crm: {
18-
name: 'CRM',
19-
objects: ['account', 'contact', 'opportunity', 'lead', 'user'],
20-
},
21-
'sales-engagement': {},
22-
engagement: {}, // TODO: merge me
23-
commerce: {},
24-
'expense-management': {},
25-
enrichment: {},
26-
database: {},
27-
'flat-files-and-spreadsheets': {},
28-
'file-storage': {},
29-
streaming: {},
30-
'personal-finance': {},
31-
other: {},
32-
hris: {},
33-
payroll: {},
34-
calendar: {},
3516
ats: {
3617
name: 'ATS',
3718
description: `Our secure API identifies employees and compensation by
@@ -40,9 +21,31 @@ const _VERTICAL_BY_KEY = {
4021
one-way with no impact on original data.`,
4122
objects: ['job', 'offer', 'candidate', 'opening'],
4223
},
24+
banking: {},
25+
calendar: {},
26+
commerce: {},
27+
communication: {},
28+
crm: {
29+
name: 'CRM',
30+
objects: ['account', 'contact', 'opportunity', 'lead', 'user'],
31+
},
32+
database: {},
33+
'developer-tools': {},
4334
email: {},
35+
engagement: {}, // TODO: merge me
36+
enrichment: {},
37+
'expense-management': {},
38+
'file-storage': {},
39+
'flat-files-and-spreadsheets': {},
40+
hris: {},
4441
messaging: {},
45-
communication: {},
42+
other: {},
43+
payroll: {},
44+
'personal-finance': {},
45+
'sales-enablement': {},
46+
'sales-engagement': {},
47+
streaming: {},
48+
ticketing: {},
4649
wiki: {},
4750
} satisfies Record<string, VerticalInfo>
4851

‎kits/connect/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@openint/connect",
3-
"version": "0.2.19",
3+
"version": "0.2.22",
44
"sideEffects": false,
55
"main": "./dist/index.js",
66
"types": "./dist/index.d.ts",

‎kits/connect/src/embed-react.tsx

+77-65
Original file line numberDiff line numberDiff line change
@@ -10,72 +10,82 @@ export interface OpenIntConnectEmbedProps
1010

1111
const DEFAULT_HEIGHT = 500
1212
const DEFAULT_WIDTH = 350
13-
export const OpenIntConnectEmbed = React.forwardRef(
14-
(
15-
{baseUrl, params, onReady, ...iframeProps}: OpenIntConnectEmbedProps,
16-
forwardedRef: React.ForwardedRef<HTMLIFrameElement>,
17-
) => {
18-
const url = getIFrameUrl({baseUrl, params})
19-
const [loading, setLoading] = React.useState(true)
13+
export const OpenIntConnectEmbed = React.memo(
14+
React.forwardRef(
15+
(
16+
props: OpenIntConnectEmbedProps,
17+
forwardedRef: React.ForwardedRef<HTMLIFrameElement>,
18+
) => {
19+
const {baseUrl, params, onReady, ...iframeProps} = props
2020

21-
React.useEffect(() => {
22-
if (
23-
typeof iframeProps.height === 'number' &&
24-
iframeProps.height < DEFAULT_HEIGHT
25-
) {
26-
console.warn(
27-
'Optimal height for Connect is 500px. Using 500px instead.',
28-
)
29-
}
30-
if (typeof iframeProps.width === 'number' && iframeProps.width < 350) {
31-
console.warn('Minimum width for Connect is 350px. Using 350px instead.')
32-
}
33-
}, [iframeProps.height, iframeProps.width])
21+
const url = React.useMemo(
22+
() => getIFrameUrl({baseUrl, params}),
23+
[baseUrl, params],
24+
)
3425

35-
const height =
36-
typeof iframeProps.height === 'number'
37-
? iframeProps.height > DEFAULT_HEIGHT
38-
? iframeProps.height
39-
: DEFAULT_HEIGHT
40-
: iframeProps.height
26+
const [loading, setLoading] = React.useState(true)
4127

42-
const width =
43-
typeof iframeProps.width === 'number'
44-
? iframeProps.width > DEFAULT_WIDTH
45-
? iframeProps.width
46-
: DEFAULT_WIDTH
47-
: iframeProps.width || DEFAULT_WIDTH
28+
React.useEffect(() => {
29+
if (
30+
typeof iframeProps.height === 'number' &&
31+
iframeProps.height < DEFAULT_HEIGHT
32+
) {
33+
console.warn(
34+
'Optimal height for Connect is 500px. Using 500px instead.',
35+
)
36+
}
37+
if (typeof iframeProps.width === 'number' && iframeProps.width < 350) {
38+
console.warn(
39+
'Minimum width for Connect is 350px. Using 350px instead.',
40+
)
41+
}
42+
}, [iframeProps.height, iframeProps.width])
4843

49-
// Add a more reliable way to know iframe has fully finished loading
50-
// by sending message from iframe to parent when ready
51-
return (
52-
<div className="connect-embed-wrapper">
53-
<div className={`spinner-container ${loading ? 'loading' : 'loaded'}`}>
54-
<svg className="spinner" viewBox="0 0 50 50">
55-
<circle
56-
className="path"
57-
cx="25"
58-
cy="25"
59-
r="20"
60-
fill="none"
61-
strokeWidth="5"></circle>
62-
</svg>
63-
</div>
64-
<iframe
65-
name="openint-connect-frame"
66-
id="openint-connect-frame"
67-
{...iframeProps}
68-
ref={forwardedRef}
69-
onLoad={() => {
70-
setLoading(false)
71-
onReady?.()
72-
}}
73-
src={url}
74-
width={width}
75-
height={height}
76-
/>
44+
const height =
45+
typeof iframeProps.height === 'number'
46+
? iframeProps.height > DEFAULT_HEIGHT
47+
? iframeProps.height
48+
: DEFAULT_HEIGHT
49+
: iframeProps.height
50+
51+
const width =
52+
typeof iframeProps.width === 'number'
53+
? iframeProps.width > DEFAULT_WIDTH
54+
? iframeProps.width
55+
: DEFAULT_WIDTH
56+
: iframeProps.width || DEFAULT_WIDTH
7757

78-
<style>{`
58+
// Add a more reliable way to know iframe has fully finished loading
59+
// by sending message from iframe to parent when ready
60+
return (
61+
<div className="connect-embed-wrapper">
62+
<div
63+
className={`spinner-container ${loading ? 'loading' : 'loaded'}`}>
64+
<svg className="spinner" viewBox="0 0 50 50">
65+
<circle
66+
className="path"
67+
cx="25"
68+
cy="25"
69+
r="20"
70+
fill="none"
71+
strokeWidth="5"></circle>
72+
</svg>
73+
</div>
74+
<iframe
75+
name="openint-connect-frame"
76+
id="openint-connect-frame"
77+
{...iframeProps}
78+
ref={forwardedRef}
79+
onLoad={() => {
80+
setLoading(false)
81+
onReady?.()
82+
}}
83+
src={url}
84+
width={width}
85+
height={height}
86+
/>
87+
88+
<style>{`
7989
.connect-embed-wrapper {
8090
display: flex;
8191
height: ${height}px;
@@ -91,7 +101,7 @@ export const OpenIntConnectEmbed = React.forwardRef(
91101
justify-content: center;
92102
align-items: center;
93103
height: 100%;
94-
background: white;
104+
background: ${params?.theme === 'dark' ? '#1C1C1C' : 'white'};
95105
transition: opacity 0.3s ease;
96106
max-width: ${width}px;
97107
max-height: ${height}px;
@@ -130,8 +140,10 @@ export const OpenIntConnectEmbed = React.forwardRef(
130140
}
131141
}
132142
`}</style>
133-
</div>
134-
)
135-
},
143+
</div>
144+
)
145+
},
146+
),
136147
)
148+
137149
OpenIntConnectEmbed.displayName = 'OpenIntConnectEmbed'

‎kits/sdk/openapi.json

+34-28
Original file line numberDiff line numberDiff line change
@@ -1510,27 +1510,30 @@
15101510
"items": {
15111511
"type": "string",
15121512
"enum": [
1513-
"banking",
15141513
"accounting",
1514+
"ats",
1515+
"banking",
1516+
"calendar",
1517+
"commerce",
1518+
"communication",
15151519
"crm",
1516-
"sales-engagement",
1520+
"database",
1521+
"developer-tools",
1522+
"email",
15171523
"engagement",
1518-
"commerce",
1519-
"expense-management",
15201524
"enrichment",
1521-
"database",
1522-
"flat-files-and-spreadsheets",
1525+
"expense-management",
15231526
"file-storage",
1524-
"streaming",
1525-
"personal-finance",
1526-
"other",
1527+
"flat-files-and-spreadsheets",
15271528
"hris",
1528-
"payroll",
1529-
"calendar",
1530-
"ats",
1531-
"email",
15321529
"messaging",
1533-
"communication",
1530+
"other",
1531+
"payroll",
1532+
"personal-finance",
1533+
"sales-enablement",
1534+
"sales-engagement",
1535+
"streaming",
1536+
"ticketing",
15341537
"wiki"
15351538
]
15361539
}
@@ -8554,27 +8557,30 @@
85548557
"items": {
85558558
"type": "string",
85568559
"enum": [
8557-
"banking",
85588560
"accounting",
8561+
"ats",
8562+
"banking",
8563+
"calendar",
8564+
"commerce",
8565+
"communication",
85598566
"crm",
8560-
"sales-engagement",
8567+
"database",
8568+
"developer-tools",
8569+
"email",
85618570
"engagement",
8562-
"commerce",
8563-
"expense-management",
85648571
"enrichment",
8565-
"database",
8566-
"flat-files-and-spreadsheets",
8572+
"expense-management",
85678573
"file-storage",
8568-
"streaming",
8569-
"personal-finance",
8570-
"other",
8574+
"flat-files-and-spreadsheets",
85718575
"hris",
8572-
"payroll",
8573-
"calendar",
8574-
"ats",
8575-
"email",
85768576
"messaging",
8577-
"communication",
8577+
"other",
8578+
"payroll",
8579+
"personal-finance",
8580+
"sales-enablement",
8581+
"sales-engagement",
8582+
"streaming",
8583+
"ticketing",
85788584
"wiki"
85798585
]
85808586
}

0 commit comments

Comments
 (0)