BugPulse-V1
This commit is contained in:
parent
fffdb669d5
commit
6c3758e6a9
5
.gitignore
vendored
5
.gitignore
vendored
@ -1,3 +1,8 @@
|
||||
node_modules/
|
||||
*/node_modules/
|
||||
*/build/
|
||||
|
||||
**/node_modules/
|
||||
**/build/
|
||||
.DS_Store
|
||||
.env
|
||||
File diff suppressed because one or more lines are too long
@ -2,6 +2,8 @@ const db = require('../models');
|
||||
const FileDBApi = require('./file');
|
||||
const crypto = require('crypto');
|
||||
const Utils = require('../utils');
|
||||
const { applyTenantScope } = require('./tenantScope');
|
||||
|
||||
|
||||
const Sequelize = db.Sequelize;
|
||||
const Op = Sequelize.Op;
|
||||
@ -295,12 +297,10 @@ module.exports = class BugsDBApi {
|
||||
const currentPage = +filter.page;
|
||||
|
||||
const user = (options && options.currentUser) || null;
|
||||
const userCompanies = (user && user.companies?.id) || null;
|
||||
|
||||
if (userCompanies) {
|
||||
if (options?.currentUser?.companiesId) {
|
||||
where.companiesId = options.currentUser.companiesId;
|
||||
}
|
||||
const userCompanies = user?.companies?.id || null;
|
||||
// Apply company filter only for users without full access
|
||||
if (!globalAccess && userCompanies) {
|
||||
where.companiesId = userCompanies;
|
||||
}
|
||||
|
||||
offset = currentPage * limit;
|
||||
|
||||
@ -2,6 +2,8 @@ const db = require('../models');
|
||||
const FileDBApi = require('./file');
|
||||
const crypto = require('crypto');
|
||||
const Utils = require('../utils');
|
||||
const { applyTenantScope } = require('./tenantScope');
|
||||
|
||||
|
||||
const Sequelize = db.Sequelize;
|
||||
const Op = Sequelize.Op;
|
||||
@ -162,12 +164,10 @@ module.exports = class CompaniesDBApi {
|
||||
const currentPage = +filter.page;
|
||||
|
||||
const user = (options && options.currentUser) || null;
|
||||
const userCompanies = (user && user.companies?.id) || null;
|
||||
|
||||
if (userCompanies) {
|
||||
if (options?.currentUser?.companiesId) {
|
||||
where.companiesId = options.currentUser.companiesId;
|
||||
}
|
||||
const userCompanies = user?.companies?.id || null;
|
||||
// Apply company filter only for users without full (global) access
|
||||
if (!globalAccess && userCompanies) {
|
||||
where.companiesId = userCompanies;
|
||||
}
|
||||
|
||||
offset = currentPage * limit;
|
||||
|
||||
@ -2,6 +2,8 @@ const db = require('../models');
|
||||
const FileDBApi = require('./file');
|
||||
const crypto = require('crypto');
|
||||
const Utils = require('../utils');
|
||||
const { applyTenantScope } = require('./tenantScope');
|
||||
|
||||
|
||||
const Sequelize = db.Sequelize;
|
||||
const Op = Sequelize.Op;
|
||||
@ -172,16 +174,8 @@ module.exports = class ModulesDBApi {
|
||||
const limit = filter.limit || 0;
|
||||
let offset = 0;
|
||||
let where = {};
|
||||
const currentPage = +filter.page;
|
||||
applyTenantScope(where, globalAccess, options);
|
||||
|
||||
const user = (options && options.currentUser) || null;
|
||||
const userCompanies = (user && user.companies?.id) || null;
|
||||
|
||||
if (userCompanies) {
|
||||
if (options?.currentUser?.companiesId) {
|
||||
where.companiesId = options.currentUser.companiesId;
|
||||
}
|
||||
}
|
||||
|
||||
offset = currentPage * limit;
|
||||
|
||||
|
||||
@ -2,6 +2,8 @@ const db = require('../models');
|
||||
const FileDBApi = require('./file');
|
||||
const crypto = require('crypto');
|
||||
const Utils = require('../utils');
|
||||
const { applyTenantScope } = require('./tenantScope');
|
||||
|
||||
|
||||
const Sequelize = db.Sequelize;
|
||||
const Op = Sequelize.Op;
|
||||
@ -164,14 +166,11 @@ module.exports = class ProjectsDBApi {
|
||||
let offset = 0;
|
||||
let where = {};
|
||||
const currentPage = +filter.page;
|
||||
|
||||
const user = (options && options.currentUser) || null;
|
||||
const userCompanies = (user && user.companies?.id) || null;
|
||||
|
||||
if (userCompanies) {
|
||||
if (options?.currentUser?.companiesId) {
|
||||
where.companiesId = options.currentUser.companiesId;
|
||||
}
|
||||
const userCompanies = user?.companies?.id || null;
|
||||
// Apply company filter only for users without full (global) access
|
||||
if (!globalAccess && userCompanies) {
|
||||
where.companiesId = userCompanies;
|
||||
}
|
||||
|
||||
offset = currentPage * limit;
|
||||
|
||||
337
backend/src/db/api/projects.js.temp
Normal file
337
backend/src/db/api/projects.js.temp
Normal file
@ -0,0 +1,337 @@
|
||||
const db = require('../models');
|
||||
const FileDBApi = require('./file');
|
||||
const crypto = require('crypto');
|
||||
const Utils = require('../utils');
|
||||
const { applyTenantScope } = require('./tenantScope');
|
||||
|
||||
|
||||
const Sequelize = db.Sequelize;
|
||||
const Op = Sequelize.Op;
|
||||
|
||||
module.exports = class ProjectsDBApi {
|
||||
static async create(data, options) {
|
||||
const currentUser = (options && options.currentUser) || { id: null };
|
||||
const transaction = (options && options.transaction) || undefined;
|
||||
|
||||
const projects = await db.projects.create(
|
||||
{
|
||||
id: data.id || undefined,
|
||||
|
||||
name: data.name || null,
|
||||
created_on: data.created_on || null,
|
||||
importHash: data.importHash || null,
|
||||
createdById: currentUser.id,
|
||||
updatedById: currentUser.id,
|
||||
},
|
||||
{ transaction },
|
||||
);
|
||||
|
||||
await projects.setCompanies(data.companies || null, {
|
||||
transaction,
|
||||
});
|
||||
|
||||
return projects;
|
||||
}
|
||||
|
||||
static async bulkImport(data, options) {
|
||||
const currentUser = (options && options.currentUser) || { id: null };
|
||||
const transaction = (options && options.transaction) || undefined;
|
||||
|
||||
// Prepare data - wrapping individual data transformations in a map() method
|
||||
const projectsData = data.map((item, index) => ({
|
||||
id: item.id || undefined,
|
||||
|
||||
name: item.name || null,
|
||||
created_on: item.created_on || null,
|
||||
importHash: item.importHash || null,
|
||||
createdById: currentUser.id,
|
||||
updatedById: currentUser.id,
|
||||
createdAt: new Date(Date.now() + index * 1000),
|
||||
}));
|
||||
|
||||
// Bulk create items
|
||||
const projects = await db.projects.bulkCreate(projectsData, {
|
||||
transaction,
|
||||
});
|
||||
|
||||
// For each item created, replace relation files
|
||||
|
||||
return projects;
|
||||
}
|
||||
|
||||
static async update(id, data, options) {
|
||||
const currentUser = (options && options.currentUser) || { id: null };
|
||||
const transaction = (options && options.transaction) || undefined;
|
||||
const globalAccess = currentUser.app_role?.globalAccess;
|
||||
|
||||
const projects = await db.projects.findByPk(id, {}, { transaction });
|
||||
|
||||
const updatePayload = {};
|
||||
|
||||
if (data.name !== undefined) updatePayload.name = data.name;
|
||||
|
||||
if (data.created_on !== undefined)
|
||||
updatePayload.created_on = data.created_on;
|
||||
|
||||
updatePayload.updatedById = currentUser.id;
|
||||
|
||||
await projects.update(updatePayload, { transaction });
|
||||
|
||||
if (data.companies !== undefined) {
|
||||
await projects.setCompanies(
|
||||
data.companies,
|
||||
|
||||
{ transaction },
|
||||
);
|
||||
}
|
||||
|
||||
return projects;
|
||||
}
|
||||
|
||||
static async deleteByIds(ids, options) {
|
||||
const currentUser = (options && options.currentUser) || { id: null };
|
||||
const transaction = (options && options.transaction) || undefined;
|
||||
|
||||
const projects = await db.projects.findAll({
|
||||
where: {
|
||||
id: {
|
||||
[Op.in]: ids,
|
||||
},
|
||||
},
|
||||
transaction,
|
||||
});
|
||||
|
||||
await db.sequelize.transaction(async (transaction) => {
|
||||
for (const record of projects) {
|
||||
await record.update({ deletedBy: currentUser.id }, { transaction });
|
||||
}
|
||||
for (const record of projects) {
|
||||
await record.destroy({ transaction });
|
||||
}
|
||||
});
|
||||
|
||||
return projects;
|
||||
}
|
||||
|
||||
static async remove(id, options) {
|
||||
const currentUser = (options && options.currentUser) || { id: null };
|
||||
const transaction = (options && options.transaction) || undefined;
|
||||
|
||||
const projects = await db.projects.findByPk(id, options);
|
||||
|
||||
await projects.update(
|
||||
{
|
||||
deletedBy: currentUser.id,
|
||||
},
|
||||
{
|
||||
transaction,
|
||||
},
|
||||
);
|
||||
|
||||
await projects.destroy({
|
||||
transaction,
|
||||
});
|
||||
|
||||
return projects;
|
||||
}
|
||||
|
||||
static async findBy(where, options) {
|
||||
const transaction = (options && options.transaction) || undefined;
|
||||
|
||||
const projects = await db.projects.findOne({ where }, { transaction });
|
||||
|
||||
if (!projects) {
|
||||
return projects;
|
||||
}
|
||||
|
||||
const output = projects.get({ plain: true });
|
||||
|
||||
output.bugs_project = await projects.getBugs_project({
|
||||
transaction,
|
||||
});
|
||||
|
||||
output.modules_project = await projects.getModules_project({
|
||||
transaction,
|
||||
});
|
||||
|
||||
output.companies = await projects.getCompanies({
|
||||
transaction,
|
||||
});
|
||||
|
||||
return output;
|
||||
}
|
||||
|
||||
static async findAll(filter, globalAccess, options) {
|
||||
const limit = filter.limit || 0;
|
||||
let offset = 0;
|
||||
let where = {};
|
||||
const currentPage = +filter.page;
|
||||
applyTenantScope(where, globalAccess, options);
|
||||
where.companiesId = userCompanies;
|
||||
}
|
||||
|
||||
offset = currentPage * limit;
|
||||
|
||||
const orderBy = null;
|
||||
|
||||
const transaction = (options && options.transaction) || undefined;
|
||||
|
||||
let include = [
|
||||
{
|
||||
model: db.companies,
|
||||
as: 'companies',
|
||||
},
|
||||
];
|
||||
|
||||
if (filter) {
|
||||
if (filter.id) {
|
||||
where = {
|
||||
...where,
|
||||
['id']: Utils.uuid(filter.id),
|
||||
};
|
||||
}
|
||||
|
||||
if (filter.name) {
|
||||
where = {
|
||||
...where,
|
||||
[Op.and]: Utils.ilike('projects', 'name', filter.name),
|
||||
};
|
||||
}
|
||||
|
||||
if (filter.created_onRange) {
|
||||
const [start, end] = filter.created_onRange;
|
||||
|
||||
if (start !== undefined && start !== null && start !== '') {
|
||||
where = {
|
||||
...where,
|
||||
created_on: {
|
||||
...where.created_on,
|
||||
[Op.gte]: start,
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
if (end !== undefined && end !== null && end !== '') {
|
||||
where = {
|
||||
...where,
|
||||
created_on: {
|
||||
...where.created_on,
|
||||
[Op.lte]: end,
|
||||
},
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
if (filter.active !== undefined) {
|
||||
where = {
|
||||
...where,
|
||||
active: filter.active === true || filter.active === 'true',
|
||||
};
|
||||
}
|
||||
|
||||
if (filter.companies) {
|
||||
const listItems = filter.companies.split('|').map((item) => {
|
||||
return Utils.uuid(item);
|
||||
});
|
||||
|
||||
where = {
|
||||
...where,
|
||||
companiesId: { [Op.or]: listItems },
|
||||
};
|
||||
}
|
||||
|
||||
if (filter.createdAtRange) {
|
||||
const [start, end] = filter.createdAtRange;
|
||||
|
||||
if (start !== undefined && start !== null && start !== '') {
|
||||
where = {
|
||||
...where,
|
||||
['createdAt']: {
|
||||
...where.createdAt,
|
||||
[Op.gte]: start,
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
if (end !== undefined && end !== null && end !== '') {
|
||||
where = {
|
||||
...where,
|
||||
['createdAt']: {
|
||||
...where.createdAt,
|
||||
[Op.lte]: end,
|
||||
},
|
||||
};
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (globalAccess) {
|
||||
delete where.companiesId;
|
||||
}
|
||||
|
||||
const queryOptions = {
|
||||
where,
|
||||
include,
|
||||
distinct: true,
|
||||
order:
|
||||
filter.field && filter.sort
|
||||
? [[filter.field, filter.sort]]
|
||||
: [['createdAt', 'desc']],
|
||||
transaction: options?.transaction,
|
||||
logging: console.log,
|
||||
};
|
||||
|
||||
if (!options?.countOnly) {
|
||||
queryOptions.limit = limit ? Number(limit) : undefined;
|
||||
queryOptions.offset = offset ? Number(offset) : undefined;
|
||||
}
|
||||
|
||||
try {
|
||||
const { rows, count } = await db.projects.findAndCountAll(queryOptions);
|
||||
|
||||
return {
|
||||
rows: options?.countOnly ? [] : rows,
|
||||
count: count,
|
||||
};
|
||||
} catch (error) {
|
||||
console.error('Error executing query:', error);
|
||||
throw error;
|
||||
}
|
||||
}
|
||||
|
||||
static async findAllAutocomplete(
|
||||
query,
|
||||
limit,
|
||||
offset,
|
||||
globalAccess,
|
||||
organizationId,
|
||||
) {
|
||||
let where = {};
|
||||
|
||||
if (!globalAccess && organizationId) {
|
||||
where.organizationId = organizationId;
|
||||
}
|
||||
|
||||
if (query) {
|
||||
where = {
|
||||
[Op.or]: [
|
||||
{ ['id']: Utils.uuid(query) },
|
||||
Utils.ilike('projects', 'name', query),
|
||||
],
|
||||
};
|
||||
}
|
||||
|
||||
const records = await db.projects.findAll({
|
||||
attributes: ['id', 'name'],
|
||||
where,
|
||||
limit: limit ? Number(limit) : undefined,
|
||||
offset: offset ? Number(offset) : undefined,
|
||||
orderBy: [['name', 'ASC']],
|
||||
});
|
||||
|
||||
return records.map((record) => ({
|
||||
id: record.id,
|
||||
label: record.name,
|
||||
}));
|
||||
}
|
||||
};
|
||||
@ -2,6 +2,8 @@ const db = require('../models');
|
||||
const FileDBApi = require('./file');
|
||||
const crypto = require('crypto');
|
||||
const Utils = require('../utils');
|
||||
const { applyTenantScope } = require('./tenantScope');
|
||||
|
||||
|
||||
const Sequelize = db.Sequelize;
|
||||
const Op = Sequelize.Op;
|
||||
@ -185,12 +187,10 @@ module.exports = class Status_historyDBApi {
|
||||
const currentPage = +filter.page;
|
||||
|
||||
const user = (options && options.currentUser) || null;
|
||||
const userCompanies = (user && user.companies?.id) || null;
|
||||
|
||||
if (userCompanies) {
|
||||
if (options?.currentUser?.companiesId) {
|
||||
where.companiesId = options.currentUser.companiesId;
|
||||
}
|
||||
const userCompanies = user?.companies?.id || null;
|
||||
// Apply company filter only for users without full access
|
||||
if (!globalAccess && userCompanies) {
|
||||
where.companiesId = userCompanies;
|
||||
}
|
||||
|
||||
offset = currentPage * limit;
|
||||
|
||||
@ -2,6 +2,8 @@ const db = require('../models');
|
||||
const FileDBApi = require('./file');
|
||||
const crypto = require('crypto');
|
||||
const Utils = require('../utils');
|
||||
const { applyTenantScope } = require('./tenantScope');
|
||||
|
||||
|
||||
const Sequelize = db.Sequelize;
|
||||
const Op = Sequelize.Op;
|
||||
@ -174,14 +176,11 @@ module.exports = class Sub_modulesDBApi {
|
||||
let offset = 0;
|
||||
let where = {};
|
||||
const currentPage = +filter.page;
|
||||
|
||||
const user = (options && options.currentUser) || null;
|
||||
const userCompanies = (user && user.companies?.id) || null;
|
||||
|
||||
if (userCompanies) {
|
||||
if (options?.currentUser?.companiesId) {
|
||||
where.companiesId = options.currentUser.companiesId;
|
||||
}
|
||||
const userCompanies = user?.companies?.id || null;
|
||||
// Apply company filter only for users without full (global) access
|
||||
if (!globalAccess && userCompanies) {
|
||||
where.companiesId = userCompanies;
|
||||
}
|
||||
|
||||
offset = currentPage * limit;
|
||||
|
||||
9
backend/src/db/api/tenantScope.js
Normal file
9
backend/src/db/api/tenantScope.js
Normal file
@ -0,0 +1,9 @@
|
||||
// Helper to apply tenant (company) scoping in findAll methods
|
||||
function applyTenantScope(where, globalAccess, options) {
|
||||
const userCompany = options?.currentUser?.companies?.id || null;
|
||||
if (!globalAccess && userCompany) {
|
||||
where.companiesId = userCompany;
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = { applyTenantScope };
|
||||
@ -2,6 +2,8 @@ const db = require('../models');
|
||||
const FileDBApi = require('./file');
|
||||
const crypto = require('crypto');
|
||||
const Utils = require('../utils');
|
||||
const { applyTenantScope } = require('./tenantScope');
|
||||
|
||||
|
||||
const bcrypt = require('bcrypt');
|
||||
const config = require('../../config');
|
||||
@ -319,12 +321,10 @@ module.exports = class UsersDBApi {
|
||||
const currentPage = +filter.page;
|
||||
|
||||
const user = (options && options.currentUser) || null;
|
||||
const userCompanies = (user && user.companies?.id) || null;
|
||||
|
||||
if (userCompanies) {
|
||||
if (options?.currentUser?.companiesId) {
|
||||
where.companiesId = options.currentUser.companiesId;
|
||||
}
|
||||
const userCompanies = user?.companies?.id || null;
|
||||
// Apply company filter only for users without full (global) access
|
||||
if (!globalAccess && userCompanies) {
|
||||
where.companiesId = userCompanies;
|
||||
}
|
||||
|
||||
offset = currentPage * limit;
|
||||
|
||||
@ -36,8 +36,9 @@ export const loadColumns = async (
|
||||
}
|
||||
|
||||
const hasUpdatePermission = hasPermission(user, 'UPDATE_PROJECTS');
|
||||
const globalAccess = user?.app_role?.globalAccess || false;
|
||||
|
||||
return [
|
||||
const columns: any[] = [
|
||||
{
|
||||
field: 'name',
|
||||
headerName: 'Name',
|
||||
@ -46,34 +47,27 @@ export const loadColumns = async (
|
||||
filterable: false,
|
||||
headerClassName: 'datagrid--header',
|
||||
cellClassName: 'datagrid--cell',
|
||||
|
||||
editable: hasUpdatePermission,
|
||||
},
|
||||
|
||||
{
|
||||
field: 'created_on',
|
||||
headerName: 'CreatedOn',
|
||||
headerName: 'Created On',
|
||||
flex: 1,
|
||||
minWidth: 120,
|
||||
filterable: false,
|
||||
headerClassName: 'datagrid--header',
|
||||
cellClassName: 'datagrid--cell',
|
||||
|
||||
editable: hasUpdatePermission,
|
||||
|
||||
type: 'dateTime',
|
||||
valueGetter: (params: GridValueGetterParams) =>
|
||||
new Date(params.row.created_on),
|
||||
valueGetter: (params: GridValueGetterParams) => new Date(params.row.created_on),
|
||||
},
|
||||
|
||||
{
|
||||
field: 'actions',
|
||||
type: 'actions',
|
||||
minWidth: 30,
|
||||
headerClassName: 'datagrid--header',
|
||||
cellClassName: 'datagrid--cell',
|
||||
getActions: (params: GridRowParams) => {
|
||||
return [
|
||||
getActions: (params: GridRowParams) => [
|
||||
<div key={params?.row?.id}>
|
||||
<ListActionsPopover
|
||||
onDelete={onDelete}
|
||||
@ -83,8 +77,22 @@ export const loadColumns = async (
|
||||
hasUpdatePermission={hasUpdatePermission}
|
||||
/>
|
||||
</div>,
|
||||
];
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
// Insert Company column for Super Admin users
|
||||
if (globalAccess) {
|
||||
columns.splice(columns.length - 1, 0, {
|
||||
field: 'companies',
|
||||
headerName: 'Company',
|
||||
flex: 1,
|
||||
minWidth: 150,
|
||||
valueGetter: (params: GridValueGetterParams) => params.row.companies?.name || '',
|
||||
headerClassName: 'datagrid--header',
|
||||
cellClassName: 'datagrid--cell',
|
||||
});
|
||||
}
|
||||
|
||||
return columns;
|
||||
};
|
||||
|
||||
@ -15,6 +15,7 @@ import 'intro.js/introjs.css';
|
||||
import { appWithTranslation } from 'next-i18next';
|
||||
import '../i18n';
|
||||
import IntroGuide from '../components/IntroGuide';
|
||||
import html2canvas from 'html2canvas';
|
||||
import {
|
||||
appSteps,
|
||||
landingSteps,
|
||||
@ -79,9 +80,8 @@ function MyApp({ Component, pageProps }: AppPropsWithLayout) {
|
||||
|
||||
if (event.data === 'getScreenshot') {
|
||||
try {
|
||||
const html2canvas = (await import('html2canvas')).default;
|
||||
const canvas = await html2canvas(document.body, { useCORS: true });
|
||||
const url = canvas.toDataURL('image/jpeg', 0.8);
|
||||
const canvasElement = await html2canvas(document.body, { useCORS: true });
|
||||
const url = canvasElement.toDataURL('image/jpeg', 0.8);
|
||||
event.source?.postMessage({ iframeScreenshot: url }, event.origin);
|
||||
} catch (e) {
|
||||
console.error('html2canvas failed', e);
|
||||
|
||||
192
frontend/src/pages/_app.tsx.temp
Normal file
192
frontend/src/pages/_app.tsx.temp
Normal file
@ -0,0 +1,192 @@
|
||||
import React from 'react';
|
||||
import type { AppProps } from 'next/app';
|
||||
import type { ReactElement, ReactNode } from 'react';
|
||||
import type { NextPage } from 'next';
|
||||
import Head from 'next/head';
|
||||
import { store } from '../stores/store';
|
||||
import { Provider } from 'react-redux';
|
||||
import '../css/main.css';
|
||||
import axios from 'axios';
|
||||
import { baseURLApi } from '../config';
|
||||
import { useRouter } from 'next/router';
|
||||
import ErrorBoundary from '../components/ErrorBoundary';
|
||||
import DevModeBadge from '../components/DevModeBadge';
|
||||
import 'intro.js/introjs.css';
|
||||
import { appWithTranslation } from 'next-i18next';
|
||||
import '../i18n';
|
||||
import IntroGuide from '../components/IntroGuide';
|
||||
import html2canvas from 'html2canvas';
|
||||
import {
|
||||
appSteps,
|
||||
landingSteps,
|
||||
loginSteps,
|
||||
usersSteps,
|
||||
rolesSteps,
|
||||
} from '../stores/introSteps';
|
||||
|
||||
// Initialize axios
|
||||
axios.defaults.baseURL = process.env.NEXT_PUBLIC_BACK_API
|
||||
? process.env.NEXT_PUBLIC_BACK_API
|
||||
: baseURLApi;
|
||||
|
||||
axios.defaults.headers.common['Content-Type'] = 'application/json';
|
||||
|
||||
export type NextPageWithLayout<P = Record<string, unknown>, IP = P> = NextPage<
|
||||
P,
|
||||
IP
|
||||
> & {
|
||||
getLayout?: (page: ReactElement) => ReactNode;
|
||||
};
|
||||
|
||||
type AppPropsWithLayout = AppProps & {
|
||||
Component: NextPageWithLayout;
|
||||
};
|
||||
|
||||
function MyApp({ Component, pageProps }: AppPropsWithLayout) {
|
||||
// Use the layout defined at the page level, if available
|
||||
const getLayout = Component.getLayout || ((page) => page);
|
||||
const router = useRouter();
|
||||
const [stepsEnabled, setStepsEnabled] = React.useState(false);
|
||||
const [stepName, setStepName] = React.useState('');
|
||||
const [steps, setSteps] = React.useState([]);
|
||||
|
||||
axios.interceptors.request.use(
|
||||
(config) => {
|
||||
const token = localStorage.getItem('token');
|
||||
|
||||
if (token) {
|
||||
config.headers.Authorization = `Bearer ${token}`;
|
||||
} else {
|
||||
delete config.headers.Authorization;
|
||||
}
|
||||
|
||||
return config;
|
||||
},
|
||||
(error) => {
|
||||
return Promise.reject(error);
|
||||
},
|
||||
);
|
||||
|
||||
// TODO: Remove this code in future releases
|
||||
React.useEffect(() => {
|
||||
const handleMessage = async (event: MessageEvent) => {
|
||||
if (event.data === 'getLocation') {
|
||||
event.source?.postMessage(
|
||||
{ iframeLocation: window.location.pathname },
|
||||
event.origin,
|
||||
);
|
||||
return;
|
||||
}
|
||||
|
||||
if (event.data === 'getScreenshot') {
|
||||
const canvasElement = await html2canvas(document.body, { useCORS: true });
|
||||
const url = canvasElement.toDataURL('image/jpeg', 0.8);
|
||||
event.source?.postMessage({ iframeScreenshot: url }, event.origin);
|
||||
} catch (e) {
|
||||
console.error('html2canvas failed', e);
|
||||
event.source?.postMessage({ iframeScreenshot: null }, event.origin);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
window.addEventListener('message', handleMessage);
|
||||
return () => window.removeEventListener('message', handleMessage);
|
||||
}, []);
|
||||
|
||||
React.useEffect(() => {
|
||||
const isCompleted = (stepKey: string) => {
|
||||
return localStorage.getItem(`completed_${stepKey}`) === 'true';
|
||||
};
|
||||
if (router.pathname === '/login' && !isCompleted('loginSteps')) {
|
||||
setSteps(loginSteps);
|
||||
setStepName('loginSteps');
|
||||
setStepsEnabled(true);
|
||||
} else if (router.pathname === '/' && !isCompleted('landingSteps')) {
|
||||
setSteps(landingSteps);
|
||||
setStepName('landingSteps');
|
||||
setStepsEnabled(true);
|
||||
} else if (router.pathname === '/dashboard' && !isCompleted('appSteps')) {
|
||||
setTimeout(() => {
|
||||
setSteps(appSteps);
|
||||
setStepName('appSteps');
|
||||
setStepsEnabled(true);
|
||||
}, 1000);
|
||||
} else if (
|
||||
router.pathname === '/users/users-list' &&
|
||||
!isCompleted('usersSteps')
|
||||
) {
|
||||
setTimeout(() => {
|
||||
setSteps(usersSteps);
|
||||
setStepName('usersSteps');
|
||||
setStepsEnabled(true);
|
||||
}, 1000);
|
||||
} else if (
|
||||
router.pathname === '/roles/roles-list' &&
|
||||
!isCompleted('rolesSteps')
|
||||
) {
|
||||
setTimeout(() => {
|
||||
setSteps(rolesSteps);
|
||||
setStepName('rolesSteps');
|
||||
setStepsEnabled(true);
|
||||
}, 1000);
|
||||
} else {
|
||||
setSteps([]);
|
||||
setStepsEnabled(false);
|
||||
}
|
||||
}, [router.pathname]);
|
||||
|
||||
const handleExit = () => {
|
||||
setStepsEnabled(false);
|
||||
};
|
||||
|
||||
const title = 'Bug reporting solution';
|
||||
const description = 'Bug reporting solution generated by Flatlogic';
|
||||
const url = 'https://flatlogic.com/';
|
||||
const image = `https://flatlogic.com/logo.svg`;
|
||||
const imageWidth = '1920';
|
||||
const imageHeight = '960';
|
||||
|
||||
return (
|
||||
<Provider store={store}>
|
||||
{getLayout(
|
||||
<>
|
||||
<Head>
|
||||
<meta name='description' content={description} />
|
||||
|
||||
<meta property='og:url' content={url} />
|
||||
<meta property='og:site_name' content='https://flatlogic.com/' />
|
||||
<meta property='og:title' content={title} />
|
||||
<meta property='og:description' content={description} />
|
||||
<meta property='og:image' content={image} />
|
||||
<meta property='og:image:type' content='image/png' />
|
||||
<meta property='og:image:width' content={imageWidth} />
|
||||
<meta property='og:image:height' content={imageHeight} />
|
||||
|
||||
<meta property='twitter:card' content='summary_large_image' />
|
||||
<meta property='twitter:title' content={title} />
|
||||
<meta property='twitter:description' content={description} />
|
||||
<meta property='twitter:image:src' content={image} />
|
||||
<meta property='twitter:image:width' content={imageWidth} />
|
||||
<meta property='twitter:image:height' content={imageHeight} />
|
||||
|
||||
<link rel='icon' href='/favicon.svg' />
|
||||
</Head>
|
||||
|
||||
<ErrorBoundary>
|
||||
<Component {...pageProps} />
|
||||
</ErrorBoundary>
|
||||
<IntroGuide
|
||||
steps={steps}
|
||||
stepsName={stepName}
|
||||
stepsEnabled={stepsEnabled}
|
||||
onExit={handleExit}
|
||||
/>
|
||||
{(process.env.NODE_ENV === 'development' ||
|
||||
process.env.NODE_ENV === 'dev_stage') && <DevModeBadge />}
|
||||
</>,
|
||||
)}
|
||||
</Provider>
|
||||
);
|
||||
}
|
||||
|
||||
export default appWithTranslation(MyApp);
|
||||
Loading…
x
Reference in New Issue
Block a user