@panneau/app 1.0.1-alpha.0 → 1.0.3-alpha.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/assets/css/styles.css +7 -0
- package/es/index.js +1810 -5
- package/lib/index.js +1841 -15
- package/package.json +66 -54
- package/scss/styles.scss +3 -0
- package/es/Panneau.js +0 -318
- package/es/actions/AuthActions.js +0 -16
- package/es/actions/LayoutActions.js +0 -14
- package/es/components/App.js +0 -129
- package/es/components/Layout.js +0 -68
- package/es/components/Panneau.js +0 -79
- package/es/components/index.js +0 -3
- package/es/components/pages/Account.js +0 -38
- package/es/components/pages/Home.js +0 -12
- package/es/components/pages/ResourceCreate.js +0 -44
- package/es/components/pages/ResourceDelete.js +0 -11
- package/es/components/pages/ResourceEdit.js +0 -28
- package/es/components/pages/ResourceForm.js +0 -343
- package/es/components/pages/ResourceIndex.js +0 -261
- package/es/components/pages/ResourceShow.js +0 -15
- package/es/components/partials/ResourceFormHeader.js +0 -111
- package/es/components/partials/ResourceIndexHeader.js +0 -71
- package/es/defaults/routes.json +0 -10
- package/es/lib/createStore.js +0 -30
- package/es/reducers/AuthReducer.js +0 -32
- package/es/reducers/index.js +0 -4
- package/lib/Panneau.js +0 -340
- package/lib/actions/AuthActions.js +0 -25
- package/lib/actions/LayoutActions.js +0 -25
- package/lib/components/App.js +0 -159
- package/lib/components/Layout.js +0 -87
- package/lib/components/Panneau.js +0 -103
- package/lib/components/index.js +0 -23
- package/lib/components/pages/Account.js +0 -54
- package/lib/components/pages/Home.js +0 -23
- package/lib/components/pages/ResourceCreate.js +0 -65
- package/lib/components/pages/ResourceDelete.js +0 -22
- package/lib/components/pages/ResourceEdit.js +0 -44
- package/lib/components/pages/ResourceForm.js +0 -376
- package/lib/components/pages/ResourceIndex.js +0 -289
- package/lib/components/pages/ResourceShow.js +0 -28
- package/lib/components/partials/ResourceFormHeader.js +0 -137
- package/lib/components/partials/ResourceIndexHeader.js +0 -87
- package/lib/defaults/routes.json +0 -10
- package/lib/lib/createStore.js +0 -46
- package/lib/reducers/AuthReducer.js +0 -43
- package/lib/reducers/index.js +0 -15
- package/src/Panneau.js +0 -274
- package/src/actions/AuthActions.js +0 -17
- package/src/actions/LayoutActions.js +0 -12
- package/src/components/App.jsx +0 -121
- package/src/components/Layout.jsx +0 -51
- package/src/components/Panneau.jsx +0 -95
- package/src/components/index.js +0 -7
- package/src/components/pages/Account.jsx +0 -34
- package/src/components/pages/Home.jsx +0 -19
- package/src/components/pages/ResourceCreate.jsx +0 -50
- package/src/components/pages/ResourceDelete.jsx +0 -18
- package/src/components/pages/ResourceEdit.jsx +0 -39
- package/src/components/pages/ResourceForm.jsx +0 -361
- package/src/components/pages/ResourceIndex.jsx +0 -256
- package/src/components/pages/ResourceShow.jsx +0 -23
- package/src/components/partials/ResourceFormHeader.jsx +0 -137
- package/src/components/partials/ResourceIndexHeader.jsx +0 -84
- package/src/defaults/routes.json +0 -10
- package/src/index.js +0 -9
- package/src/lib/createStore.js +0 -21
- package/src/reducers/AuthReducer.js +0 -23
- package/src/reducers/index.js +0 -5
- package/src/styles/layout.scss +0 -5
- package/src/styles/pages/resource-form.scss +0 -42
- package/src/styles/pages/resource-index.scss +0 -43
- package/src/styles/partials/resource-form-header.scss +0 -7
- package/src/styles/partials/resource-index-header.scss +0 -13
- package/src/styles/vendor.global.scss +0 -5
|
@@ -1,137 +0,0 @@
|
|
|
1
|
-
import React, { useMemo } from 'react';
|
|
2
|
-
import PropTypes from 'prop-types';
|
|
3
|
-
import classNames from 'classnames';
|
|
4
|
-
import { defineMessages, injectIntl } from 'react-intl';
|
|
5
|
-
import { PropTypes as PanneauPropTypes } from '@panneau/core';
|
|
6
|
-
import { isMessage, getLocalizedName } from '@panneau/core/utils';
|
|
7
|
-
import { Button, Label } from '@panneau/core/components';
|
|
8
|
-
import { useUrlGenerator } from '@panneau/core/contexts';
|
|
9
|
-
|
|
10
|
-
import styles from '../../styles/partials/resource-form-header.scss';
|
|
11
|
-
|
|
12
|
-
const messages = defineMessages({
|
|
13
|
-
switchType: {
|
|
14
|
-
id: 'app.buttons.resources.switch_type',
|
|
15
|
-
description: 'The label of the select type button',
|
|
16
|
-
defaultMessage: 'Switch type',
|
|
17
|
-
},
|
|
18
|
-
confirmSwitchType: {
|
|
19
|
-
id: 'app.resources.form.confirm_switch_type',
|
|
20
|
-
description: 'The confirm message when switching type',
|
|
21
|
-
defaultMessage: 'Are you sure you want to switch type?',
|
|
22
|
-
},
|
|
23
|
-
});
|
|
24
|
-
|
|
25
|
-
const propTypes = {
|
|
26
|
-
intl: PanneauPropTypes.intl.isRequired,
|
|
27
|
-
action: PropTypes.string,
|
|
28
|
-
type: PropTypes.definitionFormType,
|
|
29
|
-
fullscreen: PanneauPropTypes.bool,
|
|
30
|
-
resource: PanneauPropTypes.resource.isRequired,
|
|
31
|
-
title: PanneauPropTypes.label.isRequired,
|
|
32
|
-
titleTyped: PanneauPropTypes.label.isRequired,
|
|
33
|
-
valueHasChanged: PropTypes.bool,
|
|
34
|
-
confirmSwitchTypeMessage: PanneauPropTypes.label,
|
|
35
|
-
};
|
|
36
|
-
|
|
37
|
-
const defaultProps = {
|
|
38
|
-
action: 'create',
|
|
39
|
-
type: null,
|
|
40
|
-
confirmSwitchTypeMessage: messages.confirmSwitchType,
|
|
41
|
-
fullscreen: false,
|
|
42
|
-
valueHasChanged: false,
|
|
43
|
-
};
|
|
44
|
-
|
|
45
|
-
const ResourceFormHeader = ({
|
|
46
|
-
intl,
|
|
47
|
-
resource,
|
|
48
|
-
type,
|
|
49
|
-
fullscreen,
|
|
50
|
-
action,
|
|
51
|
-
title,
|
|
52
|
-
titleTyped,
|
|
53
|
-
valueHasChanged,
|
|
54
|
-
confirmSwitchTypeMessage,
|
|
55
|
-
}) => {
|
|
56
|
-
const urlGenerator = useUrlGenerator();
|
|
57
|
-
const localizedName = resource.localizedName('a');
|
|
58
|
-
|
|
59
|
-
const resourceTitle = useMemo(() => {
|
|
60
|
-
const customTitle =
|
|
61
|
-
type !== null
|
|
62
|
-
? resource.message(`titles.resources.${action}_${type.id}`) ||
|
|
63
|
-
resource.message(`titles.resources.${action}_typed`) ||
|
|
64
|
-
resource.message(`titles.resources.${action}`) ||
|
|
65
|
-
resource.message('titles.resources.default', null)
|
|
66
|
-
: resource.message(`titles.resources.${action}`) ||
|
|
67
|
-
resource.message('titles.resources.default', null);
|
|
68
|
-
const defaultTitle = type !== null ? titleTyped : title;
|
|
69
|
-
return customTitle || defaultTitle;
|
|
70
|
-
}, [resource, action, type]);
|
|
71
|
-
|
|
72
|
-
const titleElement = (
|
|
73
|
-
<h1 className={classNames(['mb-0', 'mt-0', styles.title])}>
|
|
74
|
-
<Label
|
|
75
|
-
isHtml
|
|
76
|
-
values={{
|
|
77
|
-
name: localizedName,
|
|
78
|
-
type: type !== null ? getLocalizedName(type) : null,
|
|
79
|
-
}}
|
|
80
|
-
>
|
|
81
|
-
{resourceTitle}
|
|
82
|
-
</Label>
|
|
83
|
-
</h1>
|
|
84
|
-
);
|
|
85
|
-
|
|
86
|
-
const onClickSwitchType = e => {
|
|
87
|
-
const confirmMessage = isMessage(confirmSwitchTypeMessage)
|
|
88
|
-
? intl.formatMessage(confirmSwitchTypeMessage, {
|
|
89
|
-
type: getLocalizedName(type),
|
|
90
|
-
})
|
|
91
|
-
: confirmSwitchTypeMessage;
|
|
92
|
-
// eslint-disable-next-line no-alert
|
|
93
|
-
if (valueHasChanged && !window.confirm(confirmMessage)) {
|
|
94
|
-
e.preventDefault();
|
|
95
|
-
}
|
|
96
|
-
};
|
|
97
|
-
|
|
98
|
-
return (
|
|
99
|
-
<div
|
|
100
|
-
className={classNames([
|
|
101
|
-
styles.header,
|
|
102
|
-
{
|
|
103
|
-
'py-4': !fullscreen,
|
|
104
|
-
'px-2': fullscreen,
|
|
105
|
-
'py-3': fullscreen,
|
|
106
|
-
[styles.isFullscreen]: fullscreen,
|
|
107
|
-
},
|
|
108
|
-
])}
|
|
109
|
-
>
|
|
110
|
-
{type !== null && action === 'create' ? (
|
|
111
|
-
<div className={classNames(['row', 'no-gutters', 'align-items-center'])}>
|
|
112
|
-
<div className="col">{titleElement}</div>
|
|
113
|
-
<div className={classNames(['col', 'col-md-auto', 'text-right'])}>
|
|
114
|
-
<Button
|
|
115
|
-
size="sm"
|
|
116
|
-
dropdown={resource.types().map(({ id, ...typeProps }) => ({
|
|
117
|
-
label: getLocalizedName(typeProps),
|
|
118
|
-
href: `${urlGenerator.resource(resource, 'create')}?type=${id}`,
|
|
119
|
-
active: id === type.id,
|
|
120
|
-
onClick: onClickSwitchType,
|
|
121
|
-
}))}
|
|
122
|
-
>
|
|
123
|
-
{messages.switchType}
|
|
124
|
-
</Button>
|
|
125
|
-
</div>
|
|
126
|
-
</div>
|
|
127
|
-
) : (
|
|
128
|
-
titleElement
|
|
129
|
-
)}
|
|
130
|
-
</div>
|
|
131
|
-
);
|
|
132
|
-
};
|
|
133
|
-
|
|
134
|
-
ResourceFormHeader.propTypes = propTypes;
|
|
135
|
-
ResourceFormHeader.defaultProps = defaultProps;
|
|
136
|
-
|
|
137
|
-
export default injectIntl(ResourceFormHeader);
|
|
@@ -1,84 +0,0 @@
|
|
|
1
|
-
/* eslint-disable jsx-a11y/anchor-is-valid, react/jsx-props-no-spreading */
|
|
2
|
-
import React from 'react';
|
|
3
|
-
import PropTypes from 'prop-types';
|
|
4
|
-
import classNames from 'classnames';
|
|
5
|
-
import { PropTypes as PanneauPropTypes } from '@panneau/core';
|
|
6
|
-
import { getLocalizedName } from '@panneau/core/utils';
|
|
7
|
-
import { Button, Label } from '@panneau/core/components';
|
|
8
|
-
|
|
9
|
-
import styles from '../../styles/partials/resource-index-header.scss';
|
|
10
|
-
|
|
11
|
-
const propTypes = {
|
|
12
|
-
resource: PanneauPropTypes.resource.isRequired,
|
|
13
|
-
title: PanneauPropTypes.label,
|
|
14
|
-
showAddButton: PropTypes.bool,
|
|
15
|
-
addButtonLabel: PanneauPropTypes.label,
|
|
16
|
-
getResourceActionUrl: PropTypes.func.isRequired,
|
|
17
|
-
};
|
|
18
|
-
|
|
19
|
-
const defaultProps = {
|
|
20
|
-
title: null,
|
|
21
|
-
showAddButton: true,
|
|
22
|
-
addButtonLabel: null,
|
|
23
|
-
};
|
|
24
|
-
|
|
25
|
-
const ResourceIndexHeader = ({
|
|
26
|
-
resource,
|
|
27
|
-
showAddButton,
|
|
28
|
-
title,
|
|
29
|
-
addButtonLabel,
|
|
30
|
-
getResourceActionUrl,
|
|
31
|
-
}) => {
|
|
32
|
-
const isTyped = resource.type() === 'typed';
|
|
33
|
-
const resourceName = resource.localizedName('plural');
|
|
34
|
-
|
|
35
|
-
// Title
|
|
36
|
-
const resourceTitle = resource.message(
|
|
37
|
-
'titles.resources.index',
|
|
38
|
-
<Label values={{ name: resourceName }}>{title}</Label>,
|
|
39
|
-
);
|
|
40
|
-
|
|
41
|
-
// Add button
|
|
42
|
-
const resourceAddButtonLabel = resource.message(
|
|
43
|
-
'buttons.resources.add',
|
|
44
|
-
<Label values={{ name: resourceName }}>{addButtonLabel}</Label>,
|
|
45
|
-
);
|
|
46
|
-
|
|
47
|
-
return (
|
|
48
|
-
<div className={classNames(['py-4', styles.header])}>
|
|
49
|
-
<div className={styles.cols}>
|
|
50
|
-
<div className={styles.col}>
|
|
51
|
-
<h1 className={classNames([styles.title, 'mb-0', 'mt-0'])}>{resourceTitle}</h1>
|
|
52
|
-
</div>
|
|
53
|
-
<div className={classNames([styles.col, 'text-right'])}>
|
|
54
|
-
{showAddButton ? (
|
|
55
|
-
<Button
|
|
56
|
-
href={isTyped ? getResourceActionUrl('create') : null}
|
|
57
|
-
dropdown={
|
|
58
|
-
isTyped
|
|
59
|
-
? resource.types().map((type) => ({
|
|
60
|
-
href: `${getResourceActionUrl('create')}?type=${type.id}`,
|
|
61
|
-
label: getLocalizedName(type),
|
|
62
|
-
}))
|
|
63
|
-
: null
|
|
64
|
-
}
|
|
65
|
-
>
|
|
66
|
-
{isTyped ? (
|
|
67
|
-
<>
|
|
68
|
-
{resourceAddButtonLabel} <span className="caret" />
|
|
69
|
-
</>
|
|
70
|
-
) : (
|
|
71
|
-
resourceAddButtonLabel
|
|
72
|
-
)}
|
|
73
|
-
</Button>
|
|
74
|
-
) : null}
|
|
75
|
-
</div>
|
|
76
|
-
</div>
|
|
77
|
-
</div>
|
|
78
|
-
);
|
|
79
|
-
};
|
|
80
|
-
|
|
81
|
-
ResourceIndexHeader.propTypes = propTypes;
|
|
82
|
-
ResourceIndexHeader.defaultProps = defaultProps;
|
|
83
|
-
|
|
84
|
-
export default ResourceIndexHeader;
|
package/src/defaults/routes.json
DELETED
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"home": "/",
|
|
3
|
-
"resource.index": "/:resource",
|
|
4
|
-
"resource.show": "/:resource/:id",
|
|
5
|
-
"resource.create": "/:resource/create",
|
|
6
|
-
"resource.edit": "/:resource/:id/edit",
|
|
7
|
-
"resource.store": "/:resource",
|
|
8
|
-
"resource.update": "/:resource/:id",
|
|
9
|
-
"resource.delete": "/:resource/:id"
|
|
10
|
-
}
|
package/src/index.js
DELETED
package/src/lib/createStore.js
DELETED
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
/* eslint-disable import/no-extraneous-dependencies */
|
|
2
|
-
import { createStore, applyMiddleware, combineReducers } from 'redux';
|
|
3
|
-
import { composeWithDevTools } from 'redux-devtools-extension';
|
|
4
|
-
import thunk from 'redux-thunk';
|
|
5
|
-
import promise from 'redux-promise';
|
|
6
|
-
|
|
7
|
-
export default (reducers, initialState, middlewares = [], opts = {}) => {
|
|
8
|
-
const options = {
|
|
9
|
-
...opts,
|
|
10
|
-
};
|
|
11
|
-
const reducer = combineReducers(reducers);
|
|
12
|
-
let enhancer = applyMiddleware(...middlewares, thunk, promise);
|
|
13
|
-
|
|
14
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
15
|
-
const { devTools = {} } = options;
|
|
16
|
-
const composeEnhancers = composeWithDevTools(devTools);
|
|
17
|
-
enhancer = composeEnhancers(enhancer);
|
|
18
|
-
}
|
|
19
|
-
|
|
20
|
-
return createStore(reducer, initialState, enhancer);
|
|
21
|
-
};
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
import { SET_USER } from '../actions/AuthActions';
|
|
2
|
-
|
|
3
|
-
const initialState = {
|
|
4
|
-
user: null,
|
|
5
|
-
};
|
|
6
|
-
|
|
7
|
-
const AuthReducer = (previousState = initialState, action) => {
|
|
8
|
-
const state = previousState;
|
|
9
|
-
|
|
10
|
-
switch (action.type) {
|
|
11
|
-
case SET_USER: {
|
|
12
|
-
return {
|
|
13
|
-
...state,
|
|
14
|
-
user: action.payload,
|
|
15
|
-
};
|
|
16
|
-
}
|
|
17
|
-
default: {
|
|
18
|
-
return state;
|
|
19
|
-
}
|
|
20
|
-
}
|
|
21
|
-
};
|
|
22
|
-
|
|
23
|
-
export default AuthReducer;
|
package/src/reducers/index.js
DELETED
package/src/styles/layout.scss
DELETED
|
@@ -1,42 +0,0 @@
|
|
|
1
|
-
@import '@panneau/core/src/styles/variables';
|
|
2
|
-
|
|
3
|
-
.container {
|
|
4
|
-
&.isFullscreen {
|
|
5
|
-
position: relative;
|
|
6
|
-
width: 100%;
|
|
7
|
-
height: calc(100vh - 56px);
|
|
8
|
-
}
|
|
9
|
-
}
|
|
10
|
-
|
|
11
|
-
.noticeIcon {
|
|
12
|
-
margin-right: 4px;
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
.loading {
|
|
16
|
-
text-align: center;
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
.isFullscreen {
|
|
20
|
-
.inner {
|
|
21
|
-
display: flex;
|
|
22
|
-
position: absolute;
|
|
23
|
-
top: 0;
|
|
24
|
-
left: 0;
|
|
25
|
-
flex-direction: column;
|
|
26
|
-
width: 100%;
|
|
27
|
-
height: 100%;
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
.content {
|
|
31
|
-
position: relative;
|
|
32
|
-
flex-grow: 1;
|
|
33
|
-
}
|
|
34
|
-
|
|
35
|
-
.form {
|
|
36
|
-
position: absolute;
|
|
37
|
-
top: 0;
|
|
38
|
-
left: 0;
|
|
39
|
-
width: 100%;
|
|
40
|
-
height: 100%;
|
|
41
|
-
}
|
|
42
|
-
}
|
|
@@ -1,43 +0,0 @@
|
|
|
1
|
-
@import '@panneau/core/src/styles/variables';
|
|
2
|
-
|
|
3
|
-
.container {
|
|
4
|
-
.listContainer {
|
|
5
|
-
position: relative;
|
|
6
|
-
}
|
|
7
|
-
|
|
8
|
-
.list {
|
|
9
|
-
position: relative;
|
|
10
|
-
z-index: 1;
|
|
11
|
-
}
|
|
12
|
-
|
|
13
|
-
.loading {
|
|
14
|
-
display: block;
|
|
15
|
-
position: absolute;
|
|
16
|
-
z-index: 2;
|
|
17
|
-
top: 0;
|
|
18
|
-
left: 0;
|
|
19
|
-
width: 100%;
|
|
20
|
-
height: 100%;
|
|
21
|
-
background: rgba(255, 255, 255, 0.5);
|
|
22
|
-
|
|
23
|
-
.inner {
|
|
24
|
-
display: table;
|
|
25
|
-
position: absolute;
|
|
26
|
-
top: 0;
|
|
27
|
-
left: 0;
|
|
28
|
-
width: 100%;
|
|
29
|
-
height: 100%;
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
.middle {
|
|
33
|
-
display: table-cell;
|
|
34
|
-
text-align: center;
|
|
35
|
-
vertical-align: middle;
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
&.alone {
|
|
39
|
-
position: relative;
|
|
40
|
-
height: 100px;
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
}
|