Skip to content

Commit 1f6a360

Browse files
github-actions[bot]github-actions[bot]
authored
Merge release/2.0.1 into main branch (#946)
* Add loading props to DrawerFooter actions (#942) * change Chromatic build deploy on main branch (#944) * add EmptyState component (#939) * Update module resolver to resolve dependabot (#945)
1 parent 534095c commit 1f6a360

File tree

11 files changed

+475
-106
lines changed

11 files changed

+475
-106
lines changed

‎.github/workflows/chromatic.yml‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
11
# .github/workflows/chromatic.yml
22

33
# Workflow name
4-
name: 'Chromatic build on develop'
4+
name: 'Chromatic build on main'
55

66
# Event for the workflow
77
on:
88
push:
99
branches:
10-
- develop
10+
- main
1111

1212
# List of jobs
1313
jobs:

‎package.json‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@user-interviews/ui-design-system",
3-
"version": "2.0.0",
3+
"version": "2.0.1",
44
"dependencies": {
55
"react-bootstrap": "^2.5.0",
66
"react-loading-skeleton": "^3.1.0",
@@ -63,8 +63,6 @@
6363
"@babel/plugin-transform-runtime": "^7.12.1",
6464
"@babel/preset-env": "^7.8.4",
6565
"@babel/runtime": "^7.12.5",
66-
"@bugsnag/js": "^7.0.0",
67-
"@bugsnag/plugin-react": "^7.0.0",
6866
"@fortawesome/fontawesome-svg-core": "^1.2.28",
6967
"@fortawesome/free-brands-svg-icons": "^5.15.3",
7068
"@fortawesome/pro-regular-svg-icons": "^5.15.3",
@@ -92,7 +90,7 @@
9290
"babel-eslint": "^10.0.3",
9391
"babel-jest": "^27.4.6",
9492
"babel-loader": "^8.0.6",
95-
"babel-plugin-module-resolver": "^4.0.0",
93+
"babel-plugin-module-resolver": "^5.0.0",
9694
"babel-plugin-transform-react-remove-prop-types": "^0.4.24",
9795
"babel-preset-react": "^6.24.1",
9896
"bootstrap": "5.1",

‎spec/__snapshots__/Storyshots.test.js.snap‎

Lines changed: 196 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5405,6 +5405,7 @@ Array [
54055405
className="DrawerFooter__actions"
54065406
>
54075407
<button
5408+
aria-disabled={false}
54085409
className="Button btn btn-transparent"
54095410
disabled={false}
54105411
onClick={[Function]}
@@ -5413,6 +5414,7 @@ Array [
54135414
Cancel
54145415
</button>
54155416
<button
5417+
aria-disabled={false}
54165418
className="Button btn btn-danger"
54175419
disabled={false}
54185420
onClick={[Function]}
@@ -5510,6 +5512,7 @@ Array [
55105512
className="DrawerFooter__actions"
55115513
>
55125514
<button
5515+
aria-disabled={false}
55135516
className="Button btn btn-transparent"
55145517
disabled={false}
55155518
onClick={[Function]}
@@ -5518,6 +5521,7 @@ Array [
55185521
Cancel
55195522
</button>
55205523
<button
5524+
aria-disabled={false}
55215525
className="Button btn btn-primary"
55225526
disabled={false}
55235527
onClick={[Function]}
@@ -5661,6 +5665,7 @@ Array [
56615665
className="DrawerFooter__actions"
56625666
>
56635667
<button
5668+
aria-disabled={false}
56645669
className="Button btn btn-transparent"
56655670
disabled={false}
56665671
onClick={[Function]}
@@ -5669,6 +5674,7 @@ Array [
56695674
Cancel
56705675
</button>
56715676
<button
5677+
aria-disabled={false}
56725678
className="Button btn btn-primary"
56735679
disabled={false}
56745680
onClick={[Function]}
@@ -5766,6 +5772,7 @@ Array [
57665772
className="DrawerFooter__actions"
57675773
>
57685774
<button
5775+
aria-disabled={false}
57695776
className="Button btn btn-transparent"
57705777
disabled={false}
57715778
onClick={[Function]}
@@ -5774,6 +5781,7 @@ Array [
57745781
Cancel
57755782
</button>
57765783
<button
5784+
aria-disabled={false}
57775785
className="Button btn btn-primary"
57785786
disabled={false}
57795787
onClick={[Function]}
@@ -6066,6 +6074,194 @@ exports[`Storyshots Components/Dropdown With Divider 1`] = `
60666074
</div>
60676075
`;
60686076

6077+
exports[`Storyshots Components/EmptyState Default 1`] = `
6078+
<div
6079+
className="EmptyState EmptyState--margin-top--sm"
6080+
>
6081+
<div
6082+
className="EmptyState__content"
6083+
>
6084+
<h4
6085+
className="EmptyState__title Heading Heading--lg Heading--bold"
6086+
style={
6087+
Object {
6088+
"textAlign": "center",
6089+
}
6090+
}
6091+
>
6092+
You have no projects
6093+
</h4>
6094+
<p
6095+
className="EmptyState__subtitle Text Text--md Text--regular"
6096+
style={
6097+
Object {
6098+
"textAlign": "center",
6099+
}
6100+
}
6101+
>
6102+
Launch your first project to start conducting research!
6103+
</p>
6104+
</div>
6105+
</div>
6106+
`;
6107+
6108+
exports[`Storyshots Components/EmptyState Full Width 1`] = `
6109+
<div
6110+
className="EmptyState EmptyState--margin-top--sm"
6111+
>
6112+
<div
6113+
className="EmptyState__content EmptyState--full-width"
6114+
>
6115+
<h4
6116+
className="EmptyState__title Heading Heading--lg Heading--bold"
6117+
style={
6118+
Object {
6119+
"textAlign": "center",
6120+
}
6121+
}
6122+
>
6123+
You have no projects
6124+
</h4>
6125+
<p
6126+
className="EmptyState__subtitle Text Text--md Text--regular"
6127+
style={
6128+
Object {
6129+
"textAlign": "center",
6130+
}
6131+
}
6132+
>
6133+
Launch your first project to start conducting research! Source from a pool of 2.4 million participants to reach nearly any target audience.
6134+
</p>
6135+
<div
6136+
className="EmptyState__actions"
6137+
>
6138+
<div
6139+
className="EmptyState__actions__primary-action"
6140+
>
6141+
<button
6142+
className="Button btn btn-primary"
6143+
disabled={false}
6144+
type="button"
6145+
>
6146+
<svg
6147+
aria-hidden="true"
6148+
className="svg-inline--fa fa-plus icon-left"
6149+
data-icon="plus"
6150+
data-prefix="far"
6151+
focusable="false"
6152+
role="img"
6153+
style={Object {}}
6154+
viewBox="0 0 384 512"
6155+
xmlns="http://www.w3.org/2000/svg"
6156+
>
6157+
<path
6158+
d="M368 224H224V80c0-8.84-7.16-16-16-16h-32c-8.84 0-16 7.16-16 16v144H16c-8.84 0-16 7.16-16 16v32c0 8.84 7.16 16 16 16h144v144c0 8.84 7.16 16 16 16h32c8.84 0 16-7.16 16-16V288h144c8.84 0 16-7.16 16-16v-32c0-8.84-7.16-16-16-16z"
6159+
fill="currentColor"
6160+
style={Object {}}
6161+
/>
6162+
</svg>
6163+
New project
6164+
</button>
6165+
</div>
6166+
</div>
6167+
</div>
6168+
</div>
6169+
`;
6170+
6171+
exports[`Storyshots Components/EmptyState Margin Top 1`] = `
6172+
<div
6173+
className="EmptyState EmptyState--margin-top--sm"
6174+
>
6175+
<div
6176+
className="EmptyState__content"
6177+
>
6178+
<h4
6179+
className="EmptyState__title Heading Heading--lg Heading--bold"
6180+
style={
6181+
Object {
6182+
"textAlign": "center",
6183+
}
6184+
}
6185+
>
6186+
No segments created
6187+
</h4>
6188+
<p
6189+
className="EmptyState__subtitle Text Text--md Text--regular"
6190+
style={
6191+
Object {
6192+
"textAlign": "center",
6193+
}
6194+
}
6195+
>
6196+
Add a new participant segment above
6197+
</p>
6198+
</div>
6199+
</div>
6200+
`;
6201+
6202+
exports[`Storyshots Components/EmptyState Primary Action 1`] = `
6203+
<div
6204+
className="EmptyState EmptyState--margin-top--sm"
6205+
>
6206+
<div
6207+
className="EmptyState__content"
6208+
>
6209+
<h4
6210+
className="EmptyState__title Heading Heading--lg Heading--bold"
6211+
style={
6212+
Object {
6213+
"textAlign": "center",
6214+
}
6215+
}
6216+
>
6217+
You have no projects
6218+
</h4>
6219+
<p
6220+
className="EmptyState__subtitle Text Text--md Text--regular"
6221+
style={
6222+
Object {
6223+
"textAlign": "center",
6224+
}
6225+
}
6226+
>
6227+
Launch your first project to start conducting research! Source from a pool of 2.4 million participants to reach nearly any target audience.
6228+
</p>
6229+
<div
6230+
className="EmptyState__actions"
6231+
>
6232+
<div
6233+
className="EmptyState__actions__primary-action"
6234+
>
6235+
<button
6236+
className="Button btn btn-primary"
6237+
disabled={false}
6238+
type="button"
6239+
>
6240+
<svg
6241+
aria-hidden="true"
6242+
className="svg-inline--fa fa-plus icon-left"
6243+
data-icon="plus"
6244+
data-prefix="far"
6245+
focusable="false"
6246+
role="img"
6247+
style={Object {}}
6248+
viewBox="0 0 384 512"
6249+
xmlns="http://www.w3.org/2000/svg"
6250+
>
6251+
<path
6252+
d="M368 224H224V80c0-8.84-7.16-16-16-16h-32c-8.84 0-16 7.16-16 16v144H16c-8.84 0-16 7.16-16 16v32c0 8.84 7.16 16 16 16h144v144c0 8.84 7.16 16 16 16h32c8.84 0 16-7.16 16-16V288h144c8.84 0 16-7.16 16-16v-32c0-8.84-7.16-16-16-16z"
6253+
fill="currentColor"
6254+
style={Object {}}
6255+
/>
6256+
</svg>
6257+
New project
6258+
</button>
6259+
</div>
6260+
</div>
6261+
</div>
6262+
</div>
6263+
`;
6264+
60696265
exports[`Storyshots Components/Form Default 1`] = `
60706266
<form
60716267
className="Form"

‎src/Drawer/DrawerFooter.jsx‎

Lines changed: 21 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -6,15 +6,19 @@ import Button from 'src/Button';
66
import './DrawerFooter.scss';
77

88
const DrawerFooter = ({
9-
onPrimaryAction,
9+
children,
10+
isPrimaryActionLoading,
11+
isSecondaryActionLoading,
1012
primaryActionDisabled,
1113
primaryActionIcon,
14+
primaryActionLoadingText,
1215
primaryActionText,
1316
primaryActionVariant,
14-
onSecondaryAction,
1517
secondaryActionDisabled,
18+
secondaryActionLoadingText,
1619
secondaryActionText,
17-
children,
20+
onPrimaryAction,
21+
onSecondaryAction,
1822
}) => (
1923
<div className="DrawerFooter">
2024
<div>
@@ -24,6 +28,8 @@ const DrawerFooter = ({
2428
{onSecondaryAction && (
2529
<Button
2630
disabled={secondaryActionDisabled}
31+
isLoading={isSecondaryActionLoading}
32+
loadingText={secondaryActionLoadingText}
2733
type="button"
2834
variant="transparent"
2935
onClick={onSecondaryAction}
@@ -34,7 +40,9 @@ const DrawerFooter = ({
3440
{onPrimaryAction && (
3541
<Button
3642
disabled={primaryActionDisabled}
43+
isLoading={isPrimaryActionLoading}
3744
leadingIcon={primaryActionIcon}
45+
loadingText={primaryActionLoadingText}
3846
type="button"
3947
variant={primaryActionVariant}
4048
onClick={onPrimaryAction}
@@ -48,26 +56,34 @@ const DrawerFooter = ({
4856

4957
DrawerFooter.propTypes = {
5058
children: propTypes.node,
59+
isPrimaryActionLoading: propTypes.bool,
60+
isSecondaryActionLoading: propTypes.bool,
5161
primaryActionDisabled: propTypes.bool,
5262
primaryActionIcon: propTypes.object,
63+
primaryActionLoadingText: propTypes.string,
5364
primaryActionText: propTypes.string,
5465
primaryActionVariant: propTypes.string,
5566
secondaryActionDisabled: propTypes.bool,
67+
secondaryActionLoadingText: propTypes.string,
5668
secondaryActionText: propTypes.string,
5769
onPrimaryAction: propTypes.func,
5870
onSecondaryAction: propTypes.func,
5971
};
6072

6173
DrawerFooter.defaultProps = {
6274
children: undefined,
63-
onPrimaryAction: undefined,
75+
isPrimaryActionLoading: false,
76+
isSecondaryActionLoading: false,
6477
primaryActionDisabled: false,
6578
primaryActionIcon: undefined,
79+
primaryActionLoadingText: undefined,
6680
primaryActionText: undefined,
6781
primaryActionVariant: undefined,
68-
onSecondaryAction: undefined,
6982
secondaryActionDisabled: false,
83+
secondaryActionLoadingText: undefined,
7084
secondaryActionText: undefined,
85+
onPrimaryAction: undefined,
86+
onSecondaryAction: undefined,
7187
};
7288

7389
export default DrawerFooter;

0 commit comments

Comments
 (0)