@axelor/aos-mobile-error 0.0.1
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/README.md +39 -0
- package/lib/ErrorBoundary.d.ts +28 -0
- package/lib/ErrorBoundary.js +71 -0
- package/lib/ErrorBoundary.js.map +1 -0
- package/lib/index.d.ts +1 -0
- package/lib/index.js +19 -0
- package/lib/index.js.map +1 -0
- package/package.json +42 -0
package/README.md
ADDED
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
<h1 align="center">@axelor/aos-mobile-error</h1>
|
|
2
|
+
|
|
3
|
+
<div align="center">
|
|
4
|
+
<img src="https://i.imgur.com/KJAAFlT.png" width="30%"/>
|
|
5
|
+
</div>
|
|
6
|
+
|
|
7
|
+
## Presentation
|
|
8
|
+
|
|
9
|
+
This package was developed for the [Axelor Open Mobile](https://github.com/axelor/axelor-mobile) application.
|
|
10
|
+
|
|
11
|
+
It only contains an ErrorBoundary component compatible with all React v18.2.x projects linked to an ERP based on [Axelor Open Platform](https://github.com/axelor/axelor-open-platform).
|
|
12
|
+
|
|
13
|
+
## Usage
|
|
14
|
+
|
|
15
|
+
Install the library :
|
|
16
|
+
|
|
17
|
+
```bash
|
|
18
|
+
yarn add @axelor/aos-mobile-error
|
|
19
|
+
```
|
|
20
|
+
|
|
21
|
+
All you have to do here is to wrap your application component with the ErrorBoundary component. It will catch all render errors and display the errorScreen provided to allow user to reload the application.
|
|
22
|
+
|
|
23
|
+
The component needs the following props:
|
|
24
|
+
* errorScreen : screen to be displayed when an error is detected
|
|
25
|
+
```typescript
|
|
26
|
+
errorScreen: ({errorMessage, onReloadPress}) => React.ReactNode;
|
|
27
|
+
```
|
|
28
|
+
* userIdfetcher : function to fetch user information
|
|
29
|
+
```typescript
|
|
30
|
+
userIdfetcher: () => Promise<any>;
|
|
31
|
+
```
|
|
32
|
+
* putMethod : function to perform a PUT request to the server in order to inform it of the error
|
|
33
|
+
```typescript
|
|
34
|
+
putMethod: (fetchOptions: {additionalURL: string; data: any}) => Promise<any>;
|
|
35
|
+
```
|
|
36
|
+
|
|
37
|
+
## Developpment
|
|
38
|
+
|
|
39
|
+
This package is developed as part of the Axelor Open Mobile application. To contribute, please go to the [Github project](https://github.com/axelor/axelor-mobile) and follow the guidelines. You will also find an installation guide to help you configure your environment.
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
interface ErrorBoundaryProps {
|
|
3
|
+
children: React.ReactNode;
|
|
4
|
+
errorScreen: ({ errorMessage, onReloadPress, }: {
|
|
5
|
+
errorMessage: string;
|
|
6
|
+
onReloadPress: () => any;
|
|
7
|
+
}) => React.ReactNode;
|
|
8
|
+
putMethod: (fetchOptions: {
|
|
9
|
+
additionalURL: string;
|
|
10
|
+
data: any;
|
|
11
|
+
}) => Promise<any>;
|
|
12
|
+
userIdfetcher: () => Promise<any>;
|
|
13
|
+
}
|
|
14
|
+
interface ErrorBoundaryState {
|
|
15
|
+
hasError: boolean;
|
|
16
|
+
tracing: boolean;
|
|
17
|
+
errorMessage: string;
|
|
18
|
+
}
|
|
19
|
+
declare class ErrorBoundary extends React.Component<ErrorBoundaryProps, ErrorBoundaryState> {
|
|
20
|
+
constructor(props: any);
|
|
21
|
+
static getDerivedStateFromError(): {
|
|
22
|
+
hasError: boolean;
|
|
23
|
+
};
|
|
24
|
+
componentDidCatch(error: any, errorInfo: any): void;
|
|
25
|
+
reloadApp(): void;
|
|
26
|
+
render(): React.ReactNode;
|
|
27
|
+
}
|
|
28
|
+
export default ErrorBoundary;
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
/*
|
|
2
|
+
* Axelor Business Solutions
|
|
3
|
+
*
|
|
4
|
+
* Copyright (C) 2023 Axelor (<http://axelor.com>).
|
|
5
|
+
*
|
|
6
|
+
* This program is free software: you can redistribute it and/or modify
|
|
7
|
+
* it under the terms of the GNU Affero General Public License, version 3,
|
|
8
|
+
* as published by the Free Software Foundation.
|
|
9
|
+
*
|
|
10
|
+
* This program is distributed in the hope that it will be useful,
|
|
11
|
+
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
12
|
+
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
13
|
+
* GNU Affero General Public License for more details.
|
|
14
|
+
*
|
|
15
|
+
* You should have received a copy of the GNU Affero General Public License
|
|
16
|
+
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|
17
|
+
*/
|
|
18
|
+
import React from 'react';
|
|
19
|
+
const TECHNICAL_ABNORMALITY = 0;
|
|
20
|
+
const CONFIGURATION_PROBLEM = 4;
|
|
21
|
+
class ErrorBoundary extends React.Component {
|
|
22
|
+
constructor(props) {
|
|
23
|
+
super(props);
|
|
24
|
+
this.state = {
|
|
25
|
+
hasError: false,
|
|
26
|
+
tracing: false,
|
|
27
|
+
errorMessage: '',
|
|
28
|
+
};
|
|
29
|
+
}
|
|
30
|
+
static getDerivedStateFromError() {
|
|
31
|
+
return { hasError: true };
|
|
32
|
+
}
|
|
33
|
+
componentDidCatch(error, errorInfo) {
|
|
34
|
+
const { putMethod, userIdfetcher } = this.props;
|
|
35
|
+
userIdfetcher().then(userId => {
|
|
36
|
+
this.setState(state => ({
|
|
37
|
+
...state,
|
|
38
|
+
tracing: true,
|
|
39
|
+
errorMessage: error.message,
|
|
40
|
+
}));
|
|
41
|
+
putMethod({
|
|
42
|
+
additionalURL: '/ws/rest/com.axelor.exception.db.TraceBack',
|
|
43
|
+
data: {
|
|
44
|
+
origin: 'mobile app',
|
|
45
|
+
typeSelect: TECHNICAL_ABNORMALITY,
|
|
46
|
+
categorySelect: CONFIGURATION_PROBLEM,
|
|
47
|
+
date: new Date(),
|
|
48
|
+
exception: error.message,
|
|
49
|
+
message: error.message,
|
|
50
|
+
cause: JSON.stringify(errorInfo.componentStack),
|
|
51
|
+
internalUser: { id: userId },
|
|
52
|
+
},
|
|
53
|
+
}).finally(() => this.setState(state => ({ ...state, tracing: false })));
|
|
54
|
+
});
|
|
55
|
+
}
|
|
56
|
+
reloadApp() {
|
|
57
|
+
window.location.reload();
|
|
58
|
+
}
|
|
59
|
+
render() {
|
|
60
|
+
const { errorScreen } = this.props;
|
|
61
|
+
if (this.state.hasError) {
|
|
62
|
+
return errorScreen({
|
|
63
|
+
errorMessage: this.state.errorMessage,
|
|
64
|
+
onReloadPress: () => this.setState({ hasError: false }),
|
|
65
|
+
});
|
|
66
|
+
}
|
|
67
|
+
return this.props.children;
|
|
68
|
+
}
|
|
69
|
+
}
|
|
70
|
+
export default ErrorBoundary;
|
|
71
|
+
//# sourceMappingURL=ErrorBoundary.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ErrorBoundary.js","sourceRoot":"","sources":["../src/ErrorBoundary.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,qBAAqB,GAAG,CAAC,CAAC;AAChC,MAAM,qBAAqB,GAAG,CAAC,CAAC;AAqBhC,MAAM,aAAc,SAAQ,KAAK,CAAC,SAGjC;IACC,YAAY,KAAK;QACf,KAAK,CAAC,KAAK,CAAC,CAAC;QACb,IAAI,CAAC,KAAK,GAAG;YACX,QAAQ,EAAE,KAAK;YACf,OAAO,EAAE,KAAK;YACd,YAAY,EAAE,EAAE;SACjB,CAAC;IACJ,CAAC;IAED,MAAM,CAAC,wBAAwB;QAC7B,OAAO,EAAC,QAAQ,EAAE,IAAI,EAAC,CAAC;IAC1B,CAAC;IAED,iBAAiB,CAAC,KAAK,EAAE,SAAS;QAChC,MAAM,EAAC,SAAS,EAAE,aAAa,EAAC,GAAG,IAAI,CAAC,KAAK,CAAC;QAC9C,aAAa,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE;YAC5B,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;gBACtB,GAAG,KAAK;gBACR,OAAO,EAAE,IAAI;gBACb,YAAY,EAAE,KAAK,CAAC,OAAO;aAC5B,CAAC,CAAC,CAAC;YAEJ,SAAS,CAAC;gBACR,aAAa,EAAE,4CAA4C;gBAC3D,IAAI,EAAE;oBACJ,MAAM,EAAE,YAAY;oBACpB,UAAU,EAAE,qBAAqB;oBACjC,cAAc,EAAE,qBAAqB;oBACrC,IAAI,EAAE,IAAI,IAAI,EAAE;oBAChB,SAAS,EAAE,KAAK,CAAC,OAAO;oBACxB,OAAO,EAAE,KAAK,CAAC,OAAO;oBACtB,KAAK,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,cAAc,CAAC;oBAC/C,YAAY,EAAE,EAAC,EAAE,EAAE,MAAM,EAAC;iBAC3B;aACF,CAAC,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,EAAC,GAAG,KAAK,EAAE,OAAO,EAAE,KAAK,EAAC,CAAC,CAAC,CAAC,CAAC;QACzE,CAAC,CAAC,CAAC;IACL,CAAC;IAED,SAAS;QACN,MAAc,CAAC,QAAQ,CAAC,MAAM,EAAE,CAAC;IACpC,CAAC;IAED,MAAM;QACJ,MAAM,EAAC,WAAW,EAAC,GAAG,IAAI,CAAC,KAAK,CAAC;QACjC,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE;YACvB,OAAO,WAAW,CAAC;gBACjB,YAAY,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY;gBACrC,aAAa,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAC,QAAQ,EAAE,KAAK,EAAC,CAAC;aACtD,CAAC,CAAC;SACJ;QAED,OAAO,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC;IAC7B,CAAC;CACF;AAED,eAAe,aAAa,CAAC"}
|
package/lib/index.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default as ErrorBoundary } from './ErrorBoundary';
|
package/lib/index.js
ADDED
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
/*
|
|
2
|
+
* Axelor Business Solutions
|
|
3
|
+
*
|
|
4
|
+
* Copyright (C) 2023 Axelor (<http://axelor.com>).
|
|
5
|
+
*
|
|
6
|
+
* This program is free software: you can redistribute it and/or modify
|
|
7
|
+
* it under the terms of the GNU Affero General Public License, version 3,
|
|
8
|
+
* as published by the Free Software Foundation.
|
|
9
|
+
*
|
|
10
|
+
* This program is distributed in the hope that it will be useful,
|
|
11
|
+
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
12
|
+
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
13
|
+
* GNU Affero General Public License for more details.
|
|
14
|
+
*
|
|
15
|
+
* You should have received a copy of the GNU Affero General Public License
|
|
16
|
+
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|
17
|
+
*/
|
|
18
|
+
export { default as ErrorBoundary } from './ErrorBoundary';
|
|
19
|
+
//# sourceMappingURL=index.js.map
|
package/lib/index.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AAEH,OAAO,EAAC,OAAO,IAAI,aAAa,EAAC,MAAM,iBAAiB,CAAC"}
|
package/package.json
ADDED
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@axelor/aos-mobile-error",
|
|
3
|
+
"version": "0.0.1",
|
|
4
|
+
"author": "Axelor",
|
|
5
|
+
"license": "AGPL-3.0-only",
|
|
6
|
+
"publishConfig": {
|
|
7
|
+
"access": "public"
|
|
8
|
+
},
|
|
9
|
+
"main": "lib/index.js",
|
|
10
|
+
"types": "lib/index.d.js",
|
|
11
|
+
"files": [
|
|
12
|
+
"lib"
|
|
13
|
+
],
|
|
14
|
+
"scripts": {
|
|
15
|
+
"clean": "rm -rf lib/",
|
|
16
|
+
"compile": "tsc -p tsconfig.build.json",
|
|
17
|
+
"dev": "npm run compile -- --watch",
|
|
18
|
+
"build": "npm run clean && npm run compile && npm run copy:assets",
|
|
19
|
+
"publish": "npm publish",
|
|
20
|
+
"lint": "eslint .",
|
|
21
|
+
"format": "prettier --write src/",
|
|
22
|
+
"format:check": "prettier --check src/",
|
|
23
|
+
"copy:assets": "cpx src/assets/** lib/assets",
|
|
24
|
+
"license:add": "npx add-copyright-header --generate --dir 'src'"
|
|
25
|
+
},
|
|
26
|
+
"peerDependencies": {
|
|
27
|
+
"react": "18.2.0"
|
|
28
|
+
},
|
|
29
|
+
"devDependencies": {
|
|
30
|
+
"@babel/runtime": "^7.19.0",
|
|
31
|
+
"@react-native-community/eslint-config": "^2.0.0",
|
|
32
|
+
"@types/react": "18.0.20",
|
|
33
|
+
"cpx2": "^4.2.0",
|
|
34
|
+
"eslint": "^7.32.0",
|
|
35
|
+
"metro-react-native-babel-preset": "^0.72.3",
|
|
36
|
+
"prettier": "^2.7.1",
|
|
37
|
+
"react": "18.2.0"
|
|
38
|
+
},
|
|
39
|
+
"resolutions": {
|
|
40
|
+
"@types/react": "18.0.20"
|
|
41
|
+
}
|
|
42
|
+
}
|