@nu-art/bug-report-frontend 0.400.7

package/core/module-pack.d.ts

@@ -0,0 +1,3 @@
+export declare const ModulePack_Frontend_BugReport: (import("../modules/ModuleFE_BugReport.js").ModuleFE_BugReport_Class | import("../modules/ModuleFE_BugReportAdmin.js").ModuleFE_BugReportAdmin_Class)[];
+export * from '../modules/ModuleFE_BugReport.js';
+export * from '../modules/ModuleFE_BugReportAdmin.js';

package/core/module-pack.js

@@ -0,0 +1,25 @@
+/*
+ * Allow the user to file a bug  report directly from your app
+ *
+ * Copyright (C) 2020 Adam van der Kruk aka TacB0sS
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { ModuleFE_BugReport } from '../modules/ModuleFE_BugReport.js';
+import { ModuleFE_BugReportAdmin } from '../modules/ModuleFE_BugReportAdmin.js';
+export const ModulePack_Frontend_BugReport = [
+    ModuleFE_BugReport,
+    ModuleFE_BugReportAdmin
+];
+export * from '../modules/ModuleFE_BugReport.js';
+export * from '../modules/ModuleFE_BugReportAdmin.js';

package/index.d.ts

@@ -0,0 +1,2 @@
+export * from './core/module-pack.js';
+export * from './ui/AdminBR.js';

package/index.js

@@ -0,0 +1,20 @@
+/*
+ * Permissions management system, define access level for each of
+ * your server apis, and restrict users by giving them access levels
+ *
+ * Copyright (C) 2020 Adam van der Kruk aka TacB0sS
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+export * from './core/module-pack.js';
+export * from './ui/AdminBR.js';

package/modules/ModuleFE_BugReport.d.ts

@@ -0,0 +1,12 @@
+import { Module } from '@nu-art/ts-common';
+import { ApiDefCaller } from '@nu-art/thunderstorm-shared';
+import { ApiStruct_BugReport } from '@nu-art/bug-report-shared/api';
+export declare const RequestKey_BugReportApi = "BugReport";
+export declare class ModuleFE_BugReport_Class extends Module {
+    private readonly reports;
+    readonly v1: ApiDefCaller<ApiStruct_BugReport>['v1'];
+    constructor();
+    protected init(): void;
+    private sendBugReportCallback;
+}
+export declare const ModuleFE_BugReport: ModuleFE_BugReport_Class;

package/modules/ModuleFE_BugReport.js

@@ -0,0 +1,43 @@
+/*
+ * Allow the user to file a bug  report directly from your app
+ *
+ * Copyright (C) 2020 Adam van der Kruk aka TacB0sS
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { addItemToArray, BeLogged, LogClient_MemBuffer, LogLevel, LogLevelOrdinal, Module } from '@nu-art/ts-common';
+import { apiWithBody } from '@nu-art/thunderstorm-frontend/index';
+import { ApiDef_BugReport } from '@nu-art/bug-report-shared/api';
+export const RequestKey_BugReportApi = 'BugReport';
+export class ModuleFE_BugReport_Class extends Module {
+    reports = [];
+    v1;
+    constructor() {
+        super();
+        addItemToArray(this.reports, new LogClient_MemBuffer('default'));
+        addItemToArray(this.reports, new LogClient_MemBuffer('info')
+            .setFilter(level => LogLevelOrdinal.indexOf(level) >= LogLevelOrdinal.indexOf(LogLevel.Info)));
+        this.v1 = {
+            sendBugReport: apiWithBody(ApiDef_BugReport.v1.sendBugReport, this.sendBugReportCallback),
+        };
+    }
+    init() {
+        this.reports.forEach(report => BeLogged.addClient(report));
+    }
+    sendBugReportCallback = async (response) => {
+        // const jiraTicket = response.find(ticket => ticket.platform === Platform_Jira);
+        // if(jiraTicket)
+        // 	Dialog_JiraOpened.show(jiraTicket.issueId)
+    };
+}
+export const ModuleFE_BugReport = new ModuleFE_BugReport_Class();

package/modules/ModuleFE_BugReportAdmin.d.ts

@@ -0,0 +1,13 @@
+import { Module } from '@nu-art/ts-common';
+import { ApiDefCaller } from '@nu-art/thunderstorm-shared';
+import { ApiStruct_AdminBugReport, DB_BugReport, ReportLogFile } from '@nu-art/bug-report-shared/api';
+export declare const RequestKey_GetLog = "GetLog";
+export declare const RequestKey_PostPath = "PostPath";
+export declare class ModuleFE_BugReportAdmin_Class extends Module {
+    readonly v1: ApiDefCaller<ApiStruct_AdminBugReport>['v1'];
+    constructor();
+    private logs;
+    downloadMultiLogs: (reports: ReportLogFile[]) => void;
+    getLogs: () => DB_BugReport[];
+}
+export declare const ModuleFE_BugReportAdmin: ModuleFE_BugReportAdmin_Class;

package/modules/ModuleFE_BugReportAdmin.js

@@ -0,0 +1,60 @@
+/*
+ * Allow the user to file a bug  report directly from your app
+ *
+ * Copyright (C) 2020 Adam van der Kruk aka TacB0sS
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { Module } from '@nu-art/ts-common';
+import { apiWithBody, apiWithQuery } from '@nu-art/thunderstorm-frontend/index';
+import { ApiDef_AdminBugReport } from '@nu-art/bug-report-shared/api';
+export const RequestKey_GetLog = 'GetLog';
+export const RequestKey_PostPath = 'PostPath';
+export class ModuleFE_BugReportAdmin_Class extends Module {
+    v1;
+    constructor() {
+        super();
+        this.v1 = {
+            downloadLogs: apiWithBody(ApiDef_AdminBugReport.v1.downloadLogs),
+            retrieveLogs: apiWithQuery(ApiDef_AdminBugReport.v1.retrieveLogs),
+        };
+    }
+    logs = [];
+    // public retrieveLogs = () => {
+    // 	this.logInfo('getting logs from firestore...');
+    // 	ModuleFE_XHR
+    // 		.createRequest<ApiGetLog>(HttpMethod.GET, RequestKey_GetLog)
+    // 		.setRelativeUrl('v1/bug-reports/get-logs')
+    // 		.setOnError(`Error getting new message from backend`)
+    // 		.execute(async response => {
+    // 			this.logs = response;
+    // 		});
+    //
+    // 	this.logInfo('continue... will receive an event once request is completed..');
+    // };
+    // public downloadLogs = (path: string) => {
+    // 	this.logInfo('downloading the logs to the client..');
+    // 	const bodyObject: Paths = {path: path};
+    // 	ModuleFE_XHR
+    // 		.createRequest<ApiPostPath>(HttpMethod.POST, RequestKey_PostPath)
+    // 		.setBodyAsJson(bodyObject)
+    // 		.setRelativeUrl('v1/bug-reports/download-logs')
+    // 		.setOnError(`Error getting new message from backend`)
+    // 		.execute();
+    // };
+    downloadMultiLogs = (reports) => {
+        reports.forEach(report => this.v1.downloadLogs({ path: report.path }).execute());
+    };
+    getLogs = () => this.logs;
+}
+export const ModuleFE_BugReportAdmin = new ModuleFE_BugReportAdmin_Class();

package/package.json

@@ -0,0 +1,75 @@
+{
+  "name": "@nu-art/bug-report-frontend",
+  "version": "0.400.7",
+  "description": "Bug Report Frontend",
+  "keywords": [
+    "TacB0sS",
+    "express",
+    "infra",
+    "bug-report",
+    "nu-art",
+    "thunderstorm",
+    "typescript"
+  ],
+  "homepage": "https://github.com/nu-art-js/bug-report",
+  "bugs": {
+    "url": "https://github.com/nu-art-js/bug-report/issues"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+ssh://git@github.com:nu-art-js/bug-report.git"
+  },
+  "publishConfig": {
+    "directory": "dist",
+    "linkDirectory": true
+  },
+  "license": "Apache-2.0",
+  "author": "TacB0sS",
+  "scripts": {
+    "build": "tsc"
+  },
+  "dependencies": {
+    "@nu-art/bug-report-shared": "0.400.7",
+    "@nu-art/firebase-frontend": "0.400.7",
+    "@nu-art/firebase-shared": "0.400.7",
+    "@nu-art/jira-shared": "0.400.7",
+    "@nu-art/slack-frontend": "0.400.7",
+    "@nu-art/slack-shared": "0.400.7",
+    "@nu-art/thunderstorm-frontend": "0.400.7",
+    "@nu-art/thunderstorm-shared": "0.400.7",
+    "@nu-art/ts-common": "0.400.7",
+    "@nu-art/user-account-frontend": "0.400.7",
+    "@nu-art/user-account-shared": "0.400.7",
+    "express": "^4.18.2",
+    "firebase": "^11.9.0",
+    "firebase-admin": "13.4.0",
+    "jszip": "^3.3.0",
+    "moment": "^2.29.4",
+    "react": "^18.0.0",
+    "react-dom": "^18.0.0",
+    "react-router-dom": "^6.9.0",
+    "request": "^2.88.0"
+  },
+  "devDependencies": {
+    "@types/express": "^4.17.17",
+    "@types/file-saver": "^2.0.1",
+    "@types/history": "^4.7.2",
+    "@types/jszip": "^3.1.7",
+    "@types/react": "^18.0.0",
+    "@types/request": "^2.48.1"
+  },
+  "unitConfig": {
+    "type": "typescript-lib"
+  },
+  "type": "module",
+  "exports": {
+    ".": {
+      "types": "./index.d.ts",
+      "import": "./index.js"
+    },
+    "./*": {
+      "types": "./*.d.ts",
+      "import": "./*.js"
+    }
+  }
+}

package/ui/AdminBR.d.ts

@@ -0,0 +1,8 @@
+import { ComponentSync } from '@nu-art/thunderstorm-frontend/index';
+import { OnRequestListener } from '@nu-art/thunderstorm-shared';
+export declare class AdminBR extends ComponentSync implements OnRequestListener {
+    protected deriveStateFromProps(nextProps: any): any;
+    render(): import("react/jsx-runtime").JSX.Element;
+    private createRow;
+    __onRequestCompleted: (key: string, success: boolean) => void;
+}

package/ui/AdminBR.js

@@ -0,0 +1,40 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/*
+ * Permissions management system, define access level for each of
+ * your server apis, and restrict users by giving them access levels
+ *
+ * Copyright (C) 2020 Adam van der Kruk aka TacB0sS
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { ComponentSync, } from '@nu-art/thunderstorm-frontend/index';
+import { __stringify } from '@nu-art/ts-common';
+import { ModuleFE_BugReportAdmin, RequestKey_GetLog } from '../modules/ModuleFE_BugReportAdmin.js';
+export class AdminBR extends ComponentSync {
+    deriveStateFromProps(nextProps) {
+        return { ...nextProps };
+    }
+    render() {
+        const logs = ModuleFE_BugReportAdmin.getLogs();
+        return (_jsxs("div", { children: [_jsx("button", { onClick: () => ModuleFE_BugReportAdmin.v1.retrieveLogs({}).execute(), children: "click to display logs" }), _jsx("div", { children: _jsx("table", { style: { width: '100%' }, children: logs.map(this.createRow) }) })] }));
+    }
+    createRow = (report) => _jsxs("tr", { children: [_jsx("td", { style: { padding: '15px', textAlign: 'left', border: '1px solid #ddd', fontSize: '15px' }, children: report.description }), _jsx("td", { style: { padding: '15px', textAlign: 'left', border: '1px solid #ddd', fontSize: '15px' }, children: report.reports[0].path }), _jsx("td", { style: { padding: '15px', textAlign: 'left', border: '1px solid #ddd', fontSize: '15px' }, children: __stringify(report.tickets) }), _jsx("td", { style: { padding: '15px', textAlign: 'left', border: '1px solid #ddd', fontSize: '15px' }, children: _jsx("button", { onClick: () => ModuleFE_BugReportAdmin.downloadMultiLogs(report.reports), children: "download" }) })] });
+    __onRequestCompleted = (key, success) => {
+        switch (key) {
+            default:
+                return;
+            case RequestKey_GetLog:
+                this.forceUpdate();
+        }
+    };
+}

package/ui/BugReport.d.ts

@@ -0,0 +1 @@
+export {};

package/ui/BugReport.js

@@ -0,0 +1,218 @@
+export {};
+// /*
+//  * Permissions management system, define access level for each of
+//  * your server apis, and restrict users by giving them access levels
+//  *
+//  * Copyright (C) 2020 Adam van der Kruk aka TacB0sS
+//  *
+//  * Licensed under the Apache License, Version 2.0 (the "License");
+//  * you may not use this file except in compliance with the License.
+//  * You may obtain a copy of the License at
+//  *
+//  *     http://www.apache.org/licenses/LICENSE-2.0
+//  *
+//  * Unless required by applicable law or agreed to in writing, software
+//  * distributed under the License is distributed on an "AS IS" BASIS,
+//  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+//  * See the License for the specific language governing permissions and
+//  * limitations under the License.
+//  */
+//
+// import * as React from 'react';
+// import {CSSProperties} from 'react';
+// import {BugReportModule} from '../modules/BugReportModule.js';
+// import {ModuleFE_Dialog, ModuleFE_Toaster, TS_Input, TS_TextArea} from '@nu-art/thunderstorm-frontend/index';
+// import {generateHex} from '@nu-art/ts-common';
+// import {Platform_Jira, Platform_Slack} from '@nu-art/bug-report-shared/api';
+//
+// type Props = {
+// 	shared-components?: React.ReactNode
+// }
+// const style: React.CSSProperties = {
+// 	cursor: 'pointer',
+// 	display: 'flex',
+// 	alignItems: 'center',
+// 	justifyContent: 'center',
+// 	position: 'fixed',
+// 	width: '50px',
+// 	height: '50px',
+// 	bottom: '30px',
+// 	right: '10px',
+// 	backgroundColor: '#5b7bd6',
+// 	color: 'white',
+// 	borderRadius: '50%',
+// 	borderColor: 'transparent'
+// };
+// type State = {
+// 	error?: Error,
+// 	errorInfo?: React.ErrorInfo
+// 	description?: string
+// 	subject?: string
+// }
+//
+// export class BugReport
+// 	extends React.Component<Props, State> {
+//
+// 	constructor(props: Props) {
+// 		super(props);
+// 		this.state = {};
+// 	}
+//
+// 	componentDidCatch(error: Error, errorInfo: React.ErrorInfo) {
+// 		BugReportModule.sendBugReport('Automatic submission', 'these logs were triggered by a UI failure', [Platform_Slack]);
+// 		this.setState({
+// 			error: error,
+// 			errorInfo: errorInfo
+// 		});
+// 	}
+//
+// 	showAppConfirmationDialogExample = () => {
+// 		const title = 'Bug Report';
+//
+// 		const onSubmit = () => {
+// 			if (!this.state.subject)
+// 				return ModuleFE_Toaster.toastError('you must first add a subject');
+// 			if (!this.state.description)
+// 				return ModuleFE_Toaster.toastError('you must first add a description');
+// 			BugReportModule.sendBugReport(this.state.subject, this.state.description || '', [Platform_Jira]);
+// 			this.setState({subject: undefined, description: undefined});
+// 			ModuleFE_Dialog.close();
+// 		};
+//
+// 		const content =
+// 			<div className={'ll_v_c'}>
+// 				<div style={{
+// 					border: `1px solid darkslategray`,
+// 					marginBottom: '5px',
+// 					width: '91%',
+// 					margin: '8px'
+// 				}}>
+// 					<TS_Input
+// 						id={'bug-report-subject'}
+// 						type={'text'}
+// 						value={this.state.subject || ''}
+// 						placeholder={'type bug name here'}
+// 						name={generateHex(8)}
+// 						onChange={(subject: string) => this.setState({subject})}
+// 					/>
+// 				</div>
+// 				<TS_TextArea
+// 					id={'bug-report-description'}
+// 					type="text"
+// 					style={{height: '110px', margin: '8px', width: '100%', outline: 'none'}}
+// 					value={this.state.description || ''}
+// 					placeholder={'type bug description here'}
+// 					onChange={(description: string) => this.setState({description})}/>
+// 			</div>;
+//
+//
+// 		// new Dialog_Builder(content)
+// 		// 	.setTitle(title)
+// 		// 	.addButton(DialogButton_Cancel(() => {
+// 		// 		this.setState({description: undefined, subject: undefined});
+// 		// 		ModuleFE_Dialog.close();
+// 		// 	}))
+// 		// 	.addButton(DialogButton_Submit(() => onSubmit(), 'Submit'))
+// 		// 	.setOverlayColor('rgba(102, 255, 255, 0.4)')
+// 		// 	.show();
+// 	};
+//
+// 	render() {
+// 		if (this.state.errorInfo) {
+// 			return (
+// 				<div>
+// 					<h2>Something went wrong!!</h2>
+// 					<details style={{whiteSpace: 'pre-wrap'}}>
+// 						{this.state.error && this.state.error.toString()}
+// 						<br/>
+// 						{this.state.errorInfo.componentStack}
+// 					</details>
+// 					<button style={style} onClick={() => window.location.reload()}>reload!</button>
+// 				</div>
+// 			);
+// 		}
+//
+// 		return (
+// 			<>
+// 				{this.props.children}
+// 				<div
+// 					onClick={this.showAppConfirmationDialogExample}>
+// 					{this.props.shared-components ||
+// 						<button style={style}>+</button>}
+// 				</div>
+// 			</>
+// 		);
+// 	}
+// }
+//
+//
+// //todo To remove:
+//
+// export class DialogButton_Builder
+// 	extends StylableBuilder {
+//
+// 	content!: React.ReactNode;
+// 	action!: () => void;
+// 	associatedKeys: string[] = [];
+//
+//
+// 	setContent(content: React.ReactNode) {
+// 		this.content = content;
+// 		return this;
+// 	}
+//
+// 	setAction(action: () => void) {
+// 		this.action = action;
+// 		return this;
+// 	}
+//
+// 	setAssociatedKeys(associatedKeys: string[]) {
+// 		this.associatedKeys = associatedKeys;
+// 		return this;
+// 	}
+//
+// 	build(): DialogButtonModel {
+// 		return {
+// 			style: this.style,
+// 			className: this.className,
+// 			content: this.content,
+// 			action: this.action,
+// 			associatedKeys: this.associatedKeys,
+// 		};
+// 	}
+// }
+//
+// export type DialogButtonModel = Stylable & {
+// 	content: React.ReactNode;
+// 	associatedKeys: string[];
+// 	action: () => void;
+// }
+// const defaultButtonStyle: CSSProperties = {
+// 	borderRadius: '4px',
+// 	color: 'white',
+// 	fontSize: '11px',
+// 	letterSpacing: '-0.18px',
+// 	outline: 'none',
+// 	margin: '0px 6px',
+// 	height: '23px',
+// 	width: '68px'
+// };
+//
+// const defaultSubmitStyle: CSSProperties = {
+// 	backgroundColor: '#00b5ff'
+// };
+//
+// const defaultCancelStyle: CSSProperties = {
+// 	backgroundColor: '#d9d9d9'
+// };
+// export const DialogButton_Cancel = (onSubmit?: () => void, label?: React.ReactNode) =>
+// 	new DialogButton_Builder()
+// 		.setStyle({...defaultCancelStyle, ...defaultButtonStyle})
+// 		.setContent(label || 'Cancel')
+// 		.setAction(onSubmit || ModuleFE_Dialog.close);
+//
+// export const DialogButton_Submit = (onSubmit: () => void, label?: React.ReactNode) =>
+// 	new DialogButton_Builder()
+// 		.setStyle({...defaultSubmitStyle, ...defaultButtonStyle})
+// 		.setContent(label || 'Submit')
+// 		.setAction(onSubmit);

package/ui/Dialog_JiraOpened.d.ts

@@ -0,0 +1 @@
+export {};

package/ui/Dialog_JiraOpened.js

@@ -0,0 +1,55 @@
+export {};
+// import {Dialog_Builder} from '@nu-art/thunderstorm-frontend/modules/dialog/ModuleFE_Dialog';
+// import {ComponentSync} from '@nu-art/thunderstorm-frontend/core/ComponentSync';
+// import * as React from 'react';
+//
+//
+// type Props = {
+// 	url: string
+// }
+//
+// export class Dialog_JiraOpened
+// 	extends ComponentSync<Props, {}> {
+//
+// 	protected deriveStateFromProps(nextProps: Props) {
+// 		return {};
+// 	}
+//
+// 	public static show(url: string) {
+// 		new Dialog_Builder(<Dialog_JiraOpened url={url}/>)
+// 			.setcloseOverlayOnClick(true)
+// 			.show();
+// 	}
+//
+// 	redirectToJira = () => {
+// 		if (this.props.url)
+// 			window.open(this.props.url);
+// 	};
+//
+// 	render() {
+// 		return <div className={'ll_v_s fill'} style={{width: 344}}>
+// 			<div className={'ll_v_s'} style={{flex: 1, position: 'relative'}}>
+// 				<div style={{textAlign: 'center', padding: '10px', fontSize: '16px', color: 'darkslategray'}}>Success</div>
+// 				<div style={{textAlign: 'center', padding: '5px', fontSize: '14px', color: 'darkslategray'}}>Bug report submitted successfully</div>
+// 				<div style={{position: 'relative', height: '40px'}}>
+// 					<div
+// 						className={'clickable ll_h_c'}
+// 						style={{
+// 							background: 'DeepSkyBlue',
+// 							height: 32,
+// 							paddingRight: 10,
+// 							paddingLeft: 10,
+// 							borderRadius: 16,
+// 							fontSize: '14px',
+// 							color: 'darkslategray',
+// 							position: 'absolute',
+// 							right: '35%'
+// 						}}
+// 						onClick={() => this.redirectToJira()}>
+// 						Take me to jira
+// 					</div>
+// 				</div>
+// 			</div>
+// 		</div>;
+// 	}
+// }