15 |
23 |
24 | {/* eslint-disable-next-line react/jsx-props-no-spreading */}
25 | {kanbanGrid.map((item, index) =>
27 |
28 |
29 | );
30 | };
31 |
32 | export default Kanban;
33 |
--------------------------------------------------------------------------------
/src/components/Charts/SparkLine.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { SparklineComponent, Inject, SparklineTooltip } from '@syncfusion/ej2-react-charts';
3 |
4 | class SparkLine extends React.PureComponent {
5 | render() {
6 | const { id, height, width, color, data, type, currentColor } = this.props;
7 |
8 | return (
9 |
14 |
24 |
25 | {/* eslint-disable-next-line react/jsx-props-no-spreading */}
26 | {employeesGrid.map((item, index) =>
28 |
31 |
32 | );
33 | };
34 | export default Employees;
35 |
--------------------------------------------------------------------------------
/src/pages/ColorPicker.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { ColorPickerComponent } from '@syncfusion/ej2-react-inputs';
3 |
4 | import { Header } from '../components';
5 |
6 | const change = (args) => {
7 | document.getElementById('preview').style.backgroundColor = args.currentValue.hex;
8 | };
9 |
10 | const CustomColorPicker = ({ id, mode }) =>
14 |
29 | );
30 |
31 | export default ColorPicker;
32 |
--------------------------------------------------------------------------------
/src/components/Charts/LineChart.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { ChartComponent, SeriesCollectionDirective, SeriesDirective, Inject, LineSeries, DateTime, Legend, Tooltip } from '@syncfusion/ej2-react-charts';
3 |
4 | import { lineCustomSeries, LinePrimaryXAxis, LinePrimaryYAxis } from '../../data/dummy';
5 | import { useStateContext } from '../../contexts/ContextProvider';
6 |
7 | const LineChart = () => {
8 | const { currentMode } = useStateContext();
9 |
10 | return (
11 |
16 |
17 |
28 |
18 |
27 |
19 |
22 | Inline Pallete
20 |
23 |
26 | Inline Picker
24 |
11 |
22 |
23 | {/* eslint-disable-next-line react/jsx-props-no-spreading */}
24 | {ordersGrid.map((item, index) =>
26 |
28 |
29 | );
30 | };
31 | export default Orders;
32 |
--------------------------------------------------------------------------------
/src/components/Charts/Stacked.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { ChartComponent, SeriesCollectionDirective, SeriesDirective, Inject, Legend, Category, StackingColumnSeries, Tooltip } from '@syncfusion/ej2-react-charts';
3 |
4 | import { stackedCustomSeries, stackedPrimaryXAxis, stackedPrimaryYAxis } from '../../data/dummy';
5 | import { useStateContext } from '../../contexts/ContextProvider';
6 |
7 | const Stacked = ({ width, height }) => {
8 | const { currentMode } = useStateContext();
9 |
10 | return (
11 |
9 |
10 |
31 | );
32 | };
33 |
34 | export default Header;
35 |
--------------------------------------------------------------------------------
/src/pages/Customers.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { GridComponent, ColumnsDirective, ColumnDirective, Page, Selection, Inject, Edit, Toolbar, Sort, Filter } from '@syncfusion/ej2-react-grids';
3 |
4 | import { customersData, customersGrid } from '../data/dummy';
5 | import { Header } from '../components';
6 |
7 | const Customers = () => {
8 | const selectionsettings = { persistSelection: true };
9 | const toolbarOptions = ['Delete'];
10 | const editing = { allowDeleting: true, allowEditing: true };
11 |
12 | return (
13 |
11 |
16 |
17 | {category}
12 |13 | {title} 14 |
15 |
18 |
30 | 19 | Show data by : 20 |
21 | 22 | 29 |
14 |
25 |
26 | {/* eslint-disable-next-line react/jsx-props-no-spreading */}
27 | {customersGrid.map((item, index) =>
29 |
31 |
32 | );
33 | };
34 |
35 | export default Customers;
36 |
--------------------------------------------------------------------------------
/src/pages/Charts/Area.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { ChartComponent, SeriesCollectionDirective, SeriesDirective, Inject, DateTime, SplineAreaSeries, Legend } from '@syncfusion/ej2-react-charts';
3 |
4 | import { ChartsHeader } from '../../components';
5 | import { areaCustomSeries, areaPrimaryXAxis, areaPrimaryYAxis } from '../../data/dummy';
6 | import { useStateContext } from '../../contexts/ContextProvider';
7 |
8 | const Area = () => {
9 | const { currentMode } = useStateContext();
10 |
11 | return (
12 |
13 |
31 | );
32 | };
33 |
34 | export default Area;
35 |
--------------------------------------------------------------------------------
/src/App.css:
--------------------------------------------------------------------------------
1 | @import url('https://cdn.syncfusion.com/ej2/material.css');
2 |
3 | .sidebar {
4 | box-shadow: rgb(113 122 131 / 11%) 0px 7px 30px 0px;
5 | z-index: 10;
6 | }
7 | .nav-item,
8 | .navbar {
9 | z-index: 10000;
10 | }
11 | @media screen and (max-width:800px) {
12 | .sidebar{
13 | z-index: 10000000;
14 | }
15 | }
16 |
17 | .feedback-section{
18 |
19 | }
20 |
21 | .e-dlg-center-center, .e-quick-popup-wrapper.e-device{
22 | z-index: 1000000 !important;
23 | }
24 |
25 | ::-webkit-scrollbar {
26 | width: 6px;
27 | }
28 | ::-webkit-scrollbar-thumb {
29 | background-color: rgb(216, 216, 216);
30 | border-radius: 40px;
31 | }
32 | ::-webkit-scrollbar-track {
33 | background-color: transparent;
34 | }
35 |
36 | /* color-picker style */
37 |
38 | #preview {
39 | background: transparent
40 | url('https://ej2.syncfusion.com/react/demos/src/color-picker/images/pen.png')
41 | no-repeat;
42 | display: inline-block;
43 | height: 80px;
44 | margin: 10px 0;
45 | min-width: 300px;
46 | max-width: 600px;
47 | background-color: #008000;
48 | }
49 |
50 | .e-input-group:not(.e-float-icon-left), .e-input-group.e-success:not(.e-float-icon-left), .e-input-group.e-warning:not(.e-float-icon-left), .e-input-group.e-error:not(.e-float-icon-left), .e-input-group.e-control-wrapper:not(.e-float-icon-left), .e-input-group.e-control-wrapper.e-success:not(.e-float-icon-left), .e-input-group.e-control-wrapper.e-warning:not(.e-float-icon-left), .e-input-group.e-control-wrapper.e-error:not(.e-float-icon-left){
51 | border: none;
52 | }
53 |
--------------------------------------------------------------------------------
/src/pages/Charts/Bar.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { ChartComponent, SeriesCollectionDirective, SeriesDirective, Inject, Legend, Category, Tooltip, ColumnSeries, DataLabel } from '@syncfusion/ej2-react-charts';
3 |
4 | import { barCustomSeries, barPrimaryXAxis, barPrimaryYAxis } from '../../data/dummy';
5 | import { ChartsHeader } from '../../components';
6 | import { useStateContext } from '../../contexts/ContextProvider';
7 |
8 | const Bar = () => {
9 | const { currentMode } = useStateContext();
10 |
11 | return (
12 |
15 |
23 |
25 | {/* eslint-disable-next-line react/jsx-props-no-spreading */}
26 | {areaCustomSeries.map((item, index) =>
28 |
29 |
30 |
13 |
32 | );
33 | };
34 |
35 | export default Bar;
36 |
--------------------------------------------------------------------------------
/src/contexts/ContextProvider.js:
--------------------------------------------------------------------------------
1 | import React, { createContext, useContext, useState } from 'react';
2 |
3 | const StateContext = createContext();
4 |
5 | const initialState = {
6 | chat: false,
7 | cart: false,
8 | userProfile: false,
9 | notification: false,
10 | };
11 |
12 | export const ContextProvider = ({ children }) => {
13 | const [screenSize, setScreenSize] = useState(undefined);
14 | const [currentColor, setCurrentColor] = useState(localStorage.getItem('colorMode') || '#03C9D7');
15 | const [currentMode, setCurrentMode] = useState(localStorage.getItem('themeMode') || 'Light');
16 | const [themeSettings, setThemeSettings] = useState(false);
17 | const [activeMenu, setActiveMenu] = useState(true);
18 | const [isClicked, setIsClicked] = useState(initialState);
19 |
20 | const setMode = (e) => {
21 | setCurrentMode(e.target.value);
22 | localStorage.setItem('themeMode', e.target.value);
23 | };
24 |
25 | const setColor = (color) => {
26 | setCurrentColor(color);
27 | localStorage.setItem('colorMode', color);
28 | };
29 |
30 | const handleClick = (clicked) => setIsClicked({ ...initialState, [clicked]: true });
31 |
32 | return (
33 | // eslint-disable-next-line react/jsx-no-constructed-context-values
34 |
15 |
24 |
26 | {/* eslint-disable-next-line react/jsx-props-no-spreading */}
27 | {barCustomSeries.map((item, index) =>
29 |
30 |
31 |
13 |
35 | );
36 | };
37 |
38 | export default Notification;
39 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "project_dashboard",
3 | "version": "0.1.0",
4 | "private": true,
5 | "dependencies": {
6 | "@syncfusion/ej2": "^19.4.56",
7 | "@syncfusion/ej2-react-calendars": "^19.4.56",
8 | "@syncfusion/ej2-react-charts": "^19.4.54",
9 | "@syncfusion/ej2-react-dropdowns": "^19.4.56",
10 | "@syncfusion/ej2-react-grids": "^19.4.56",
11 | "@syncfusion/ej2-react-inputs": "^19.4.52",
12 | "@syncfusion/ej2-react-kanban": "^19.4.52",
13 | "@syncfusion/ej2-react-popups": "^19.4.53",
14 | "@syncfusion/ej2-react-richtexteditor": "^19.4.56",
15 | "@syncfusion/ej2-react-schedule": "^19.4.55",
16 | "emailjs-com": "^3.2.0",
17 | "react": "^17.0.2",
18 | "react-dom": "^17.0.2",
19 | "react-icons": "^4.7.1",
20 | "react-router-dom": "^6.6.1",
21 | "react-scripts": "^5.0.0"
22 | },
23 | "scripts": {
24 | "start": "react-scripts start",
25 | "build": "react-scripts build",
26 | "test": "react-scripts test",
27 | "eject": "react-scripts eject"
28 | },
29 | "eslintConfig": {
30 | "extends": [
31 | "react-app",
32 | "react-app/jest"
33 | ]
34 | },
35 | "browserslist": {
36 | "production": [
37 | ">0.2%",
38 | "not dead",
39 | "not op_mini all"
40 | ],
41 | "development": [
42 | "last 1 chrome version",
43 | "last 1 firefox version",
44 | "last 1 safari version"
45 | ]
46 | },
47 | "devDependencies": {
48 | "autoprefixer": "^10.4.2",
49 | "eslint": "^8.9.0",
50 | "eslint-config-airbnb": "^19.0.4",
51 | "eslint-plugin-import": "^2.25.4",
52 | "eslint-plugin-jsx-a11y": "^6.5.1",
53 | "eslint-plugin-react": "^7.28.0",
54 | "eslint-plugin-react-hooks": "^4.3.0",
55 | "postcss": "^8.4.6",
56 | "tailwindcss": "^3.0.19"
57 | }
58 | }
59 |
--------------------------------------------------------------------------------
/.eslintrc.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | env: {
3 | browser: true,
4 | es2021: true,
5 | },
6 | extends: [
7 | 'plugin:react/recommended',
8 | 'airbnb',
9 | ],
10 | parserOptions: {
11 | ecmaFeatures: {
12 | jsx: true,
13 | },
14 | ecmaVersion: 12,
15 | sourceType: 'module',
16 | },
17 | plugins: [
18 | 'react',
19 | ],
20 | rules: {
21 | 'react/function-component-definition': 0,
22 | 'import/extensions': 0,
23 | 'react/prop-types': 0,
24 | 'linebreak-style': 0,
25 | 'react/state-in-constructor': 0,
26 | 'import/prefer-default-export': 0,
27 | 'max-len': [
28 | 2,
29 | 550,
30 | ],
31 | 'no-multiple-empty-lines': [
32 | 'error',
33 | {
34 | max: 1,
35 | maxEOF: 1,
36 | },
37 | ],
38 | 'no-underscore-dangle': [
39 | 'error',
40 | {
41 | allow: [
42 | '_d',
43 | '_dh',
44 | '_h',
45 | '_id',
46 | '_m',
47 | '_n',
48 | '_t',
49 | '_text',
50 | ],
51 | },
52 | ],
53 | 'object-curly-newline': 0,
54 | 'react/jsx-filename-extension': 0,
55 | 'react/jsx-one-expression-per-line': 0,
56 | 'jsx-a11y/click-events-have-key-events': 0,
57 | 'jsx-a11y/alt-text': 0,
58 | 'jsx-a11y/no-autofocus': 0,
59 | 'jsx-a11y/no-static-element-interactions': 0,
60 | 'react/no-array-index-key': 0,
61 | 'jsx-a11y/anchor-is-valid': [
62 | 'error',
63 | {
64 | components: [
65 | 'Link',
66 | ],
67 | specialLink: [
68 | 'to',
69 | 'hrefLeft',
70 | 'hrefRight',
71 | ],
72 | aspects: [
73 | 'noHref',
74 | 'invalidHref',
75 | 'preferButton',
76 | ],
77 | },
78 | ],
79 | },
80 | };
81 |
--------------------------------------------------------------------------------
/public/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
12 |
13 |
17 |
18 |
19 |
20 |
29 |
14 |
20 |
15 |
18 | } color="rgb(153, 171, 180)" bgHoverColor="light-gray" size="2xl" borderRadius="50%" />
19 | Notifications
16 | 17 |
21 | {chatData?.map((item, index) => (
22 |
34 |
23 | 
24 |
29 | ))}
30 |
25 |
28 | {item.message}
26 |{item.desc}
27 |
31 |
32 |
33 |
13 |
45 | );
46 | };
47 |
48 | export default Pyramid;
49 |
--------------------------------------------------------------------------------
/src/pages/Charts/Financial.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { ChartComponent, SeriesCollectionDirective, SeriesDirective, Inject, HiloSeries, Tooltip, DateTime, Zoom, Logarithmic, Crosshair } from '@syncfusion/ej2-react-charts';
3 |
4 | import { financialChartData, FinancialPrimaryXAxis, FinancialPrimaryYAxis } from '../../data/dummy';
5 | import { useStateContext } from '../../contexts/ContextProvider';
6 | import { ChartsHeader } from '../../components';
7 |
8 | const date1 = new Date('2022, 1, 1');
9 |
10 | // eslint-disable-next-line consistent-return
11 | function filterValue(value) {
12 | if (value.x >= date1) {
13 | // eslint-disable-next-line no-sequences
14 | return value.x, value.high, value.low;
15 | }
16 | }
17 | const returnValue = financialChartData.filter(filterValue);
18 |
19 | const Financial = () => {
20 | const { currentMode } = useStateContext();
21 |
22 | return (
23 |
15 |
21 |
23 |
42 |
43 |
44 |
24 |
50 | );
51 | };
52 |
53 | export default Financial;
54 |
--------------------------------------------------------------------------------
/.github/workflows/ auto-comment.yml:
--------------------------------------------------------------------------------
1 | name: Auto Comment
2 | on:
3 | issues:
4 | types:
5 | - opened
6 | - closed
7 | - assigned
8 | pull_request:
9 | types:
10 | - opened
11 | - closed
12 |
13 | jobs:
14 | run:
15 | runs-on: ubuntu-latest
16 | steps:
17 | - name: Auto Comment on Issues Opened
18 | uses: wow-actions/auto-comment@v1
19 | with:
20 | GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
21 | issuesOpened: |
22 | Hey @{{ author }},
23 |
24 | Thank you for raising an issue. We will investigate into the matter and get back to you as soon as possible.
25 |
26 | Please make sure you have given us as much context as possible.
27 |
28 | - name: Auto Comment on Issues Closed
29 | uses: wow-actions/auto-comment@v1
30 | with:
31 | GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
32 | issuesClosed: |
33 | Hey @{{ author }}, This issue is closed.
34 |
35 | - name: Auto Comment on Pull Request Merged
36 | uses: wow-actions/auto-comment@v1
37 | with:
38 | GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
39 | pullRequestMerged: |
40 | Hey, @{{ author }} Thank you for the valuable contribution!
41 |
42 | - name: Auto Comment on Pull Request Opened
43 | uses: wow-actions/auto-comment@v1
44 | with:
45 | GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
46 | pullRequestOpened: |
47 | Hey @{{ author }},
48 |
26 |
35 |
37 |
47 |
48 |
49 | 49 | Thank you for raising your pull request and contributing to our Community 🎉 50 | 51 | Please make sure you have followed our contributing guidelines. We will review it as soon as possible. 52 | 53 | - name: Auto Comment on Issues Assigned 54 | uses: wow-actions/auto-comment@v1 55 | with: 56 | GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} 57 | issuesAssigned: | 58 | Hey @{{ author }}, thank you for raising an issue. I have assigned the issue to you. You can now start working on it. If you encounter any problems, feel free to connect with us. 59 | -------------------------------------------------------------------------------- /src/pages/Charts/ColorMapping.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { ChartComponent, SeriesCollectionDirective, SeriesDirective, Inject, ColumnSeries, Category, Tooltip, Legend, RangeColorSettingsDirective, RangeColorSettingDirective } from '@syncfusion/ej2-react-charts'; 3 | 4 | import { colorMappingData, ColorMappingPrimaryXAxis, ColorMappingPrimaryYAxis, rangeColorMapping } from '../../data/dummy'; 5 | import { ChartsHeader } from '../../components'; 6 | import { useStateContext } from '../../contexts/ContextProvider'; 7 | 8 | const ColorMapping = () => { 9 | const { currentMode } = useStateContext(); 10 | 11 | return ( 12 |
13 |
45 | );
46 | };
47 |
48 | export default ColorMapping;
49 |
--------------------------------------------------------------------------------
/src/pages/Calendar.jsx:
--------------------------------------------------------------------------------
1 | import React, { useState } from 'react';
2 | import { ScheduleComponent, ViewsDirective, ViewDirective, Day, Week, WorkWeek, Month, Agenda, Inject, Resize, DragAndDrop } from '@syncfusion/ej2-react-schedule';
3 | import { DatePickerComponent } from '@syncfusion/ej2-react-calendars';
4 |
5 | import { scheduleData } from '../data/dummy';
6 | import { Header } from '../components';
7 |
8 | // eslint-disable-next-line react/destructuring-assignment
9 | const PropertyPane = (props) =>
15 |
24 |
26 |
38 |
39 | {/* eslint-disable-next-line react/jsx-props-no-spreading */}
40 | {rangeColorMapping.map((item, index) =>
42 |
43 |
44 | {props.children}
;
10 |
11 | const Scheduler = () => {
12 | const [scheduleObj, setScheduleObj] = useState();
13 |
14 | const change = (args) => {
15 | scheduleObj.selectedDate = args.value;
16 | scheduleObj.dataBind();
17 | };
18 |
19 | const onDragStart = (arg) => {
20 | // eslint-disable-next-line no-param-reassign
21 | arg.navigation.enable = true;
22 | };
23 |
24 | return (
25 |
26 | setScheduleObj(schedule)}
30 | selectedDate={new Date(2022, 0, 10)}
31 | eventSettings={{ dataSource: scheduleData }}
32 | dragStart={onDragStart}
33 | >
34 |
35 | { ['Day', 'Week', 'WorkWeek', 'Month', 'Agenda'].map((item) =>
37 |
39 |
40 |
43 |
44 |
57 |
58 |
59 | );
60 | };
61 |
62 | export default Scheduler;
63 |
--------------------------------------------------------------------------------
/src/components/Chat.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { MdOutlineCancel } from 'react-icons/md';
3 |
4 | import { Button } from '.';
5 | import { chatData } from '../data/dummy';
6 | import { useStateContext } from '../contexts/ContextProvider';
7 |
8 | const Chat = () => {
9 | const { currentColor } = useStateContext();
10 |
11 | return (
12 | |
46 | |
54 |
13 |
60 | );
61 | };
62 |
63 | export default Chat;
64 |
--------------------------------------------------------------------------------
/CODE_OF_CONDUCT.md:
--------------------------------------------------------------------------------
1 | # Code of Conduct
2 |
3 | We are committed to providing a friendly, inclusive, and safe environment for all participants in our project repository. This code of conduct outlines our expectations for behavior and ensures that everyone can collaborate in a positive and respectful manner. By participating in this project, you agree to abide by this code of conduct.
4 |
5 | ## 1. Be Respectful and Inclusive
6 |
7 | Treat all participants with respect and courtesy, regardless of their race, ethnicity, nationality, gender identity, sexual orientation, age, disability, religion, or any other personal characteristics. Create an inclusive and welcoming environment for everyone to contribute.
8 |
9 | ## 2. Foster a Collaborative Atmosphere
10 |
11 | Encourage open and constructive discussions. Be receptive to different ideas and perspectives. Avoid personal attacks, harassment, or any form of offensive or derogatory language or behavior.
12 |
13 | ## 3. Be Mindful of Language and Tone
14 |
15 | Use clear and inclusive language when communicating in discussions, comments, and documentation. Be mindful of how your words may be perceived by others. Refrain from using offensive, discriminatory, or inflammatory language.
16 | ## 4. Exercise Empathy and Understanding
17 |
18 | Take into account that participants may have different backgrounds and experiences. Be considerate and understanding when communicating with others. If a misunderstanding occurs, seek to resolve it in a peaceful and respectful manner.
19 |
20 | ## 5. Respect Privacy and Confidentiality
21 |
22 | Respect the privacy and confidentiality of others. Do not share personal information without consent. Be cautious when handling sensitive data and ensure compliance with relevant privacy laws and regulations.
23 |
24 | ## 6. Report Incidents
25 |
26 | If you witness or experience any behavior that violates this code of conduct, promptly report it to the project maintainers or administrators. Provide as much detail as possible to help in the investigation. All reports will be handled confidentially and with discretion.
27 |
28 | ## 7. Enforcement
29 |
30 | Violation of this code of conduct may result in temporary or permanent restrictions on participation in the project repository. Project maintainers and administrators reserve the right to enforce this code of conduct and take appropriate actions to address any misconduct or breaches of conduct.
31 |
32 |
33 | ## 8. Acknowledgment
34 |
35 | We value and appreciate everyone's contributions to our project repository. By following this code of conduct, we can create a supportive and inclusive environment where collaboration and growth thrive.
--------------------------------------------------------------------------------
/src/components/UserProfile.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { MdOutlineCancel } from 'react-icons/md';
3 |
4 | import { Button } from '.';
5 | import { userProfileData } from '../data/dummy';
6 | import { useStateContext } from '../contexts/ContextProvider';
7 | import avatar from '../data/avatar.jpg';
8 |
9 | const UserProfile = () => {
10 | const { currentColor } = useStateContext();
11 |
12 | return (
13 |
14 |
28 |
15 |
20 | }
22 | color="rgb(153, 171, 180)"
23 | bgHoverColor="light-gray"
24 | size="2xl"
25 | borderRadius="50%"
26 | />
27 | Messages
16 | 19 |
29 | {chatData?.map((item, index) => (
30 |
59 |
31 |
48 | ))}
49 |
32 |
37 |
41 |
42 |
43 |
47 | {item.message}
44 |{item.desc}
45 |{item.time}
46 |
50 |
57 |
58 |
14 |
66 |
67 | );
68 | };
69 |
70 | export default UserProfile;
71 |
--------------------------------------------------------------------------------
/.github/workflows/codeql.yml:
--------------------------------------------------------------------------------
1 | name: "CodeQL"
2 |
3 | on:
4 | push:
5 | branches: [ "main" ]
6 | pull_request:
7 | # The branches below must be a subset of the branches above
8 | branches: [ "main" ]
9 | schedule:
10 | - cron: '43 3 * * 6'
11 |
12 | jobs:
13 | analyze:
14 | name: Analyze
15 | runs-on: ${{ (matrix.language == 'swift' && 'macos-latest') || 'ubuntu-latest' }}
16 | timeout-minutes: ${{ (matrix.language == 'swift' && 120) || 360 }}
17 | permissions:
18 | actions: read
19 | contents: read
20 | security-events: write
21 |
22 | strategy:
23 | fail-fast: false
24 | matrix:
25 | language: [ 'javascript' ]
26 | # CodeQL supports [ 'cpp', 'csharp', 'go', 'java', 'javascript', 'python', 'ruby', 'swift' ]
27 | # Use only 'java' to analyze code written in Java, Kotlin or both
28 | # Use only 'javascript' to analyze code written in JavaScript, TypeScript or both
29 | # Learn more about CodeQL language support at https://aka.ms/codeql-docs/language-support
30 |
31 | steps:
32 | - name: Checkout repository
33 | uses: actions/checkout@v3
34 |
35 | # Initializes the CodeQL tools for scanning.
36 | - name: Initialize CodeQL
37 | uses: github/codeql-action/init@v2
38 | with:
39 | languages: ${{ matrix.language }}
40 | # If you wish to specify custom queries, you can do so here or in a config file.
41 | # By default, queries listed here will override any specified in a config file.
42 | # Prefix the list here with "+" to use these queries and those in the config file.
43 |
44 | # For more details on CodeQL's query packs, refer to: https://docs.github.com/en/code-security/code-scanning/automatically-scanning-your-code-for-vulnerabilities-and-errors/configuring-code-scanning#using-queries-in-ql-packs
45 | # queries: security-extended,security-and-quality
46 |
47 |
48 | # Autobuild attempts to build any compiled languages (C/C++, C#, Go, Java, or Swift).
49 | # If this step fails, then you should remove it and run the build manually (see below)
50 | - name: Autobuild
51 | uses: github/codeql-action/autobuild@v2
52 |
53 | # ℹ️ Command-line programs to run using the OS shell.
54 | # 📚 See https://docs.github.com/en/actions/using-workflows/workflow-syntax-for-github-actions#jobsjob_idstepsrun
55 |
56 | # If the Autobuild fails above, remove it and uncomment the following three lines.
57 | # modify them (or add more) to build your code if your project, please refer to the EXAMPLE below for guidance.
58 |
59 | # - run: |
60 | # echo "Run, Build Application using script"
61 | # ./location_of_script_within_repo/buildscript.sh
62 |
63 | - name: Perform CodeQL Analysis
64 | uses: github/codeql-action/analyze@v2
65 | with:
66 | category: "/language:${{matrix.language}}"
--------------------------------------------------------------------------------
/CONTRIBUTING.md:
--------------------------------------------------------------------------------
1 | # Contributing Guidelines
2 |
3 | Thank you for considering contributing to this project! We appreciate your interest and support. This document outlines the guidelines and expectations for contributing to this repository. Please take a moment to review this information before submitting any contributions.
4 |
5 | ## Reporting Bugs and Issues
6 |
7 | If you encounter a bug or issue while using this project, we encourage you to report it. When reporting bugs, please provide as much information as possible, including:
8 |
9 | - Steps to reproduce the issue
10 | - Expected behavior
11 | - Actual behavior
12 | - Any relevant error messages or screenshots
13 |
14 | To report a bug or issue, please follow these steps:
15 |
16 | 1. Go to the [Issues](https://github.com/swarnavopramanik/Admin-Panel/issues/) section of the repository.
17 | 2. Click on the "New Issue" button.
18 | 3. Fill in the necessary details, following the provided template.
19 |
20 | ## Suggesting New Features or Improvements
21 |
22 | If you have an idea for a new feature or an improvement to an existing feature, we would love to hear from you! To suggest a new feature, please follow these steps:
23 |
24 | 1. Go to the [Issues](https://github.com/swarnavopramanik/Admin-Panel/issues/) section of the repository.
25 | 2. Click on the "New Issue" button.
26 | 3. Fill in the necessary details, following the provided template.
27 |
28 | ## Code Formatting and Style Guidelines
29 |
30 | Consistent code formatting and style are important for maintaining a clean and readable codebase. Please adhere to the following guidelines when submitting code changes:
31 |
32 | - Use spaces for indentation (4 spaces per level).
33 | - Follow the established naming conventions for variables, functions, and classes.
34 | - Write clear and concise comments to explain complex code sections.
35 |
36 | ## Submitting Pull Requests
37 |
38 | We welcome contributions through pull requests (PRs). To submit a PR, please follow these steps:
39 |
40 | 1. Fork the repository to your GitHub account.
41 | 2. Create a new branch for your changes.
42 | 3. Make the necessary code changes in your branch.
43 | 4. Test your changes thoroughly.
44 | 5. Submit a pull request, explaining the purpose and details of your changes.
45 | 6. Be open to feedback and actively participate in the review process.
46 |
47 | ## Communication
48 |
49 | Effective communication is essential for maintaining a collaborative and inclusive environment. When participating in discussions, please:
50 |
51 | - Be respectful and considerate towards others.
52 | - Provide constructive feedback and suggestions.
53 | - Clearly express your thoughts and ideas.
54 | - Be open to different perspectives and opinions.
55 |
56 | By following these guidelines, we aim to create a welcoming community where everyone feels comfortable and empowered to contribute.
57 |
58 | Thank you for your interest and support!
59 |
60 |
--------------------------------------------------------------------------------
/src/components/Feedback.jsx:
--------------------------------------------------------------------------------
1 | import React, { useState } from 'react';
2 | import emailjs from 'emailjs-com';
3 | import { MdOutlineCancel } from 'react-icons/md';
4 | import Button from './Button';
5 |
6 | const Feedback = () => {
7 | const [feedback, setFeedBack] = useState('');
8 | const [submitted, setSubmitted] = useState(false);
9 | const [email, setEmail] = useState('');
10 | emailjs.init('1AkXF-PC-6FG2Ym15');
11 |
12 | const handleSubmit = (e) => {
13 | e.preventDefault();
14 |
15 | const templateParams = {
16 | feedback,
17 | from_email: email,
18 | to_email: 'swarnavo.pramanik8697@gmail.com',
19 | };
20 | emailjs
21 | .send('service_c8wox7q', 'template_47lh3vm', templateParams, '1AkXF-PC-6FG2Ym15')
22 | .then((response) => {
23 | console.log('Feedback sent!', response.status, response.text);
24 | setSubmitted(true);
25 | setFeedBack('');
26 | setEmail('');
27 | })
28 | .catch((error) => {
29 | console.error('Error sending feedback:', error);
30 | });
31 | };
32 | return (
33 |
34 |
15 |
24 | User Profile
16 | } 18 | color="rgb(153, 171, 180)" 19 | bgHoverColor="light-gray" 20 | size="2xl" 21 | borderRadius="50%" 22 | /> 23 |
25 | 
30 |
36 |
31 |
35 | Swarnavo Pramanik
32 |Administrator
33 |swarnavo.pramanik@shop.com
34 |
37 | {userProfileData.map((item, index) => (
38 |
39 |
56 |
40 |
47 |
48 |
53 |
54 | ))}
55 |
49 |
52 | {item.title}
50 |{item.desc}
51 |
57 |
64 |
65 |
35 |
36 |
41 |
37 |
39 | } color="rgb(153, 171, 180)" bgHoverColor="light-gray" size="2xl" borderRadius="50%" />
40 | Share Your Feedback
38 |