altence / lightence-ant-design-react-template Goto Github PK
View Code? Open in Web Editor NEWFree and easy-to-use admin template based on React 17+
Home Page: https://altence.com/lightence-landing
License: MIT License
Free and easy-to-use admin template based on React 17+
Home Page: https://altence.com/lightence-landing
License: MIT License
Describe the bug
Warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?
Check the render method of Styled(BaseCheckbox)
.
To Reproduce
Steps to reproduce the behavior:
Desktop:
Investigate and add animation for card hover, examples can be found here themeforest.net
Hi I think the link has been revoked
Describe the bug
email
and password
inputs use different fonts
The same issue for Sign up form as well
Expected behavior
email
and password
should both use Montserrat font.
Add visual effects while hovering
Describe the bug
When the header filter is applied there is no visual effect on the icon
Expected behavior
Filter icon should have some effect when active
Describe the bug
lighthouse shows 60% score for a11y
To Reproduce
Steps to reproduce the behavior:
Expected behavior
a11y should be >90%
Add hover effect while hovering sidebar menu item
Describe the bug
TypeScript error in /src/pages/uiComponentsPages/forms/DateTimePickersPage.tsx(18,12):
To Reproduce
Steps to reproduce the behavior:
yarn start
'DayjsDatePicker' cannot be used as a JSX component.
Its instance type 'Component<PickerProps & { status?: "" | "warning" | "error" | undefined; dropdownClassName?: string | undefined; popupClassName?: string | undefined; }, unknown, any> & CommonPickerMethods' is not a valid JSX element.
The types returned by 'render()' are incompatible between these types.
Type 'React.ReactNode' is not assignable to type 'import("/node_modules/@types/styled-components/node_modules/@types/react/index").ReactNode'.
Type '{}' is not assignable to type 'ReactNode'.ts(2786)
Make the article title bigger.
To Reproduce
Steps to reproduce the behavior:
Screenshots
https://i.imgur.com/V3VZI3F.png
Desktop (please complete the following information):
This is the first time I'm trying to deploy the demo locally, I didn't have a problem with deploying npmfixed branch. Now I'm going to use default branch and after fixing all requirements as described by Altence team, I get this error after using yarn start
command :
Compiled with warnings.
my-awesome-project/src/components/profile/profileCard/profileFormNav/nav/PersonalInfo/PhoneItem/PhoneItem.tsx
TypeScript error in /my-awesome-project/src/components/profile/profileCard/profileFormNav/nav/PersonalInfo/PhoneItem/PhoneItem.tsx(34,27):
No overload matches this call.
Overload 1 of 2, '(props: { onChange: (value?: E164Number | undefined) => void; value?: E164Number | undefined; country?: CountryCode | undefined; international?: boolean | undefined; ... 4 more ...; smartCaret?: boolean | undefined; } & { ...; } & { ...; }): ReactElement<...>', gave the following error.
Type '{ disabled: boolean | undefined; className: string; onClick: (() => void) | undefined; }' is not assignable to type 'IntrinsicAttributes & { onChange: (value?: E164Number | undefined) => void; value?: E164Number | undefined; country?: CountryCode | undefined; ... 5 more ...; smartCaret?: boolean | undefined; } & { ...; } & { ...; }'.
Property 'disabled' does not exist on type 'IntrinsicAttributes & { onChange: (value?: E164Number | undefined) => void; value?: E164Number | undefined; country?: CountryCode | undefined; ... 5 more ...; smartCaret?: boolean | undefined; } & { ...; } & { ...; }'.
Overload 2 of 2, '(props: StyledComponentPropsWithAs<PhoneInputComponentType, any, {}, never, PhoneInputComponentType, PhoneInputComponentType>): ReactElement<...>', gave the following error.
Type '{ disabled: boolean | undefined; className: string; onClick: (() => void) | undefined; }' is not assignable to type 'IntrinsicAttributes & { onChange: (value?: E164Number | undefined) => void; value?: E164Number | undefined; country?: CountryCode | undefined; ... 5 more ...; smartCaret?: boolean | undefined; } & { ...; } & { ...; }'.
Property 'disabled' does not exist on type 'IntrinsicAttributes & { onChange: (value?: E164Number | undefined) => void; value?: E164Number | undefined; country?: CountryCode | undefined; ... 5 more ...; smartCaret?: boolean | undefined; } & { ...; } & { ...; }'. TS2769
32 | ]}
33 | >
> 34 | <S.PhoneNumberInput disabled={verified} className="ant-input" onClick={onClick} />
| ^
35 | </BaseButtonsForm.Item>
36 | );
37 | };
Search for the keywords to learn more about each warning.
To ignore, add // eslint-disable-next-line to the line before.
I would appreciate your attention and response. Thank you.
Describe the bug
Once the user opens any page in dev mode, they see the following error:
"
Warning: Using UNSAFE_componentWillMount in strict mode is not recommended and may indicate bugs in your code. See https://reactjs.org/link/unsafe-component-lifecycles for details.
Move code with side effects to componentDidMount, and set initial state in the constructor.
Please update the following components: SideEffect(NullComponent)
"
Expected behavior
No error
Describe the bug
when i try to start by "yarn start" it shows me "error:030000086: digital envelope routines::initialization error" ... more at screen.
Expected behavior
start server
Screenshots
https://pasteboard.co/WSvFiLFumXWL.png
Desktop (please complete the following information):
Win11
Chrome
v. 113.0.5672.127
node 20.0.0 (updated to 20.2, but nothing changed)
Additional context
I tried npm audit, reinstall and version you working on it at pull request, but nothing helps, on overstackflow people recommend only chance is downgrade node.
Thank you. Btw your your discord invite in readme doesnt work.
To Reproduce
Steps to reproduce the behavior:
Screenshots
Screenshot
Desktop (please complete the following information):
Additional context
Add any other context about the problem here.
Is your feature request related to a problem? Please describe.
There is a feature of ANTD Form, using which we can trigger Form events like submit, get validation errors anywhere we want, without having to use the actual submit button.
Describe the solution you'd like
I tried using the ref props, but it's not working on the BaseButtonsForm
Is your feature request related to a problem? Please describe.
Currently theme changing doesn't happen so smooth and have some bad user experience.
Describe the solution you'd like
Instead of build files '.less' for each theme would be nice to use CSS variables. We can easily use variables in styled components and replace and customize antd
basic styles. Changing theme will happen by changing data attribute in document which will trigger updating all styles.
Hello Team, thank you for this project !.
I forked this project to build my own app (it is for our office). I have almost finished the developments but i cannot deploy the app.
I cannot even see the "index.html" in the build folder (Looks like it have not been generated).
On heroku, the app is deployed but it cannot start. Here is what i got :
2022-11-17T11:30:11.611665+00:00 heroku[run.1263]: State changed from up to complete
2022-11-17T11:48:43.147702+00:00 heroku[web.1]: State changed from crashed to starting
2022-11-17T11:48:54.743785+00:00 heroku[web.1]: Starting process with command npm start
2022-11-17T11:48:56.457981+00:00 app[web.1]:
2022-11-17T11:48:56.457996+00:00 app[web.1]: > [email protected] start
2022-11-17T11:48:56.457997+00:00 app[web.1]: > yarn buildThemes && craco start
2022-11-17T11:48:56.457997+00:00 app[web.1]:
2022-11-17T11:48:57.900755+00:00 app[web.1]: command not found: lessc
2022-11-17T11:48:58.054611+00:00 heroku[web.1]: Process exited with status 127
2022-11-17T11:48:58.119504+00:00 heroku[web.1]: State changed from starting to crashed
Please help me, i am almost at the deadline !!
Describe the bug
A clear and concise description of what the bug is.
To Reproduce
Steps to reproduce the behavior:
Expected behavior
A clear and concise description of what you expected to happen.
Screenshots
If applicable, add screenshots to help explain your problem.
Desktop (please complete the following information):
Smartphone (please complete the following information):
Additional context
Add any other context about the problem here.
yarn build production does not works
It does create the build folder but does not works
Describe the bug
utils.tsx contains function that may return ReactNode. It's better to create a component for it.
Expected behavior
No markup in utils.ts
Describe the solution you'd like
https://ant.design/docs/react/migration-v5
Describe the bug
When screen width is 1282px < width < 1362px the right "ProfileDropdown" move to next column. It's a reason why header have bigger height and display search and button incorrectly.
To Reproduce
Steps to reproduce the behavior:
search
input and github
button shows incorrectly.Expected behavior
search
input and github
button in header should display with correct styles. Header height should be the same on different screen sizes.
Desktop (please complete the following information):
Describe the bug
When running starter project in FireFox custom scrolling of only content part is broken. Site works with default scroll behavior
Also that brakes background filling. So full page looks like that:
No problem in Chrome.
Also, main project (from main branch) works as expected in FireFox.
To Reproduce
Steps to reproduce the behavior:
git clone -b starter https://github.com/altence/lightence-admin.git my-awesome-project && cd my-awesome-project
yarn install && yarn start
Expected behavior
Expected that starter project will work same as main one. Without broken styles.
Desktop (please complete the following information):
Additional context
It is really important for people who want to use this project as base for their project.
Describe the bug
The filter isn't working at all.
Expected behavior
It must work once the Apply
button is clicked. Not once input changed.
This is not a bug report, just a question. My code works in main
, but not in v2.0.0
, maybe due to some babel upgrade. After bisecting, I found out that main
doesn't contain v2.0.0
at all. Why is this the case? Which one should I use?
Is your feature request related to a problem? Please describe.
Sign up form is too large and it's necessary to scroll it even on medium screens. Need to remove the scroll by updating the form.
Describe the solution you'd like
Confirm Password
inputSign up with Google
and Sign up with Facebook
on the same row.Describe the bug
More menu -> Archivate
Expected behavior
Rename to
More menu -> Archive
I got this error while yarn build command and here is my package.json file
{
"name": "lightence-admin",
"version": "1.0.0",
"license": "MIT",
"description": "Free and easy-to-use admin template based on React 17+",
"repository": {
"type": "git",
"url": "git+github.com:altence/lightence-admin.git"
},
"bugs": {
"url": "https://github.com/altence/lightence-admin/issues"
},
"dependencies": {
"@ant-design/icons": "^4.6.2",
"@craco/craco": "^6.1.2",
"@reduxjs/toolkit": "^1.7.1",
"@types/lodash": "^4.14.188",
"antd": "^4.22.4",
"antd-mask-input": "^0.1.15",
"axios": "^0.24.0",
"axios-mock-adapter": "^1.20.0",
"country-list": "^2.2.0",
"dayjs": "^1.11.0",
"echarts": "^5.1.2",
"echarts-for-react": "^3.0.1",
"elt-react-credit-cards": "^0.0.1",
"google-map-react": "^2.1.10",
"history": "^5.3.0",
"i18next": "^20.4.0",
"leaflet": "^1.7.1",
"lodash": "^4.17.21",
"moment": "^2.29.4",
"patch-package": "^6.4.7",
"pigeon-maps": "^0.19.7",
"postinstall-postinstall": "^2.1.0",
"react": "^17.0.2",
"react-avatar": "^5.0.3",
"react-big-calendar": "^1.5.0",
"react-country-flag": "^3.0.2",
"react-dom": "^17.0.2",
"react-helmet": "^6.1.0",
"react-i18next": "^11.11.4",
"react-infinite-scroll-component": "^6.1.0",
"react-insta-stories": "^2.3.0",
"react-leaflet": "next",
"react-phone-number-input": "^3.1.27",
"react-redux": "^7.2.6",
"react-responsive": "^8.2.0",
"react-router-dom": "^6.0.2",
"react-router-hash-link": "^2.4.3",
"react-scripts": "4.0.3",
"react-simple-maps": "^2.3.0",
"react-slick": "^0.28.1",
"react-trello": "^2.2.11",
"react-verification-input": "^2.0.3",
"redux-persist": "^6.0.0",
"slick-carousel": "^1.8.1",
"slotpicker": "^3.0.1",
"styled-components": "^5.3.0",
"typeface-lato": "^1.1.13",
"typeface-montserrat": "^1.1.13",
"typescript": "^4.1.2",
"uuid": "^8.3.2",
"web-vitals": "^1.0.1",
"workbox-background-sync": "^5.1.3",
"workbox-broadcast-update": "^5.1.3",
"workbox-cacheable-response": "^5.1.3",
"workbox-core": "^5.1.3",
"workbox-expiration": "^5.1.3",
"workbox-google-analytics": "^5.1.3",
"workbox-navigation-preload": "^5.1.3",
"workbox-precaching": "^5.1.3",
"workbox-range-requests": "^5.1.3",
"workbox-routing": "^5.1.3",
"workbox-strategies": "^5.1.3",
"workbox-streams": "^5.1.3"
},
"scripts": {
"start": "yarn buildThemes && craco --openssl-legacy-provider start",
"build": "yarn buildThemes && craco --openssl-legacy-provider build",
"test": "craco test",
"eject": "craco eject",
"lint": "eslint "/**/.{js,ts,tsx}" --fix",
"lint:styles": "stylelint '/**/.{js,ts,tsx}'",
"prepare": "husky install",
"postinstall": "patch-package",
"buildThemes": "lessc --js --clean-css="--s1 --advanced" src/styles/themes/main.less public/themes/main.css"
},
"browserslist": [
">0.2%",
"not dead",
"not op_mini all",
"not IE 11"
],
"devDependencies": {
"@types/country-list": "^2.1.0",
"@types/google-map-react": "^2.1.3",
"@types/leaflet": "^1.7.9",
"@types/react": "^17.0.43",
"@types/react-big-calendar": "^0.38.2",
"@types/react-dom": "^17.0.14",
"@types/react-helmet": "^6.1.5",
"@types/react-phone-number-input": "^3.0.13",
"@types/react-responsive": "^8.0.2",
"@types/react-router-dom": "^5.1.7",
"@types/react-router-hash-link": "^2.4.4",
"@types/react-simple-maps": "^1.0.7",
"@types/react-slick": "^0.23.8",
"@types/styled-components": "^5.1.10",
"@types/uuid": "^8.3.4",
"@typescript-eslint/eslint-plugin": "^5.10.0",
"@typescript-eslint/parser": "^5.8.0",
"craco-alias": "^3.0.1",
"eslint": "^7.28.0",
"eslint-config-prettier": "^8.3.0",
"eslint-plugin-prettier": "^3.4.0",
"eslint-plugin-react": "^7.24.0",
"eslint-plugin-react-hooks": "^4.3.0",
"husky": "^6.0.0",
"less": "^4.1.2",
"less-plugin-clean-css": "^1.5.1",
"lint-staged": "^11.0.0",
"prettier": "^2.3.1",
"stylelint": "^13.13.1",
"stylelint-config-recommended": "^5.0.0",
"stylelint-config-styled-components": "^0.1.1",
"stylelint-processor-styled-components": "^1.10.0",
"webpack-bundle-analyzer": "^4.4.2",
"webpackbar": "^5.0.0-3"
},
"lint-staged": {
"/**/.{js,ts,tsx}": "yarn lint"
},
"engines": {
"node": "16.x"
},
"resolutions": {
"react-error-overlay": "6.0.9",
"source-map": "^0.8.0-beta.0"
},
"packageManager": "[email protected]",
"keywords": [
"lightence",
"admin",
"admin-dashboard",
"ant-design",
"react"
]
}
When the latest screening user is selected let's color their name along with the avatar border
Need to check and add RTL support
Describe the solution you'd like
Add Role/Permission management system to provide access to pages / components based on user role.
Describe the bug
When the user clicks on the assignee area, it's getting removed.
Expected behavior
Assignee should be removed once user clicks on X button, not assignee themselves
Describe the bug
After click selector/dropdown/datepicker the app is freezing (potential antd issue with react 18).
To Reproduce
Steps to reproduce the behavior:
Expected behavior
After click popup is open with the list of months.
Desktop (please complete the following information):
Additional context
With React 18 this happens intermittently on some pages
Is your feature request related to a problem? Please describe.
Describe the solution you'd like
A user complained about jumping title
Is there any docs in order to get auth pages work?
Is your feature request related to a problem? Please describe.
Ant Design Menu component suggest to use items
instead of children
for better performace.
Describe the solution you'd like
Check sidebar and Dropdowns page and fix console warnings.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.