From 2f65f2112a3b04cdf28571f4f1ba48ad83d9ee24 Mon Sep 17 00:00:00 2001 From: VladMihalache Date: Tue, 14 Jan 2025 00:27:57 +0200 Subject: [PATCH] 3.0.0 --- CHANGELOG.md | 10 +++++ README.md | 2 +- next.config.js | 4 -- package.json | 21 +++++----- src/app/admin/nft-marketplace/page.tsx | 2 +- .../admin/data-tables/CheckTable.tsx | 2 +- src/components/admin/default/CheckTable.tsx | 38 +++++++++---------- src/components/admin/default/DailyTraffic.tsx | 12 +++--- src/components/admin/default/PieChartCard.tsx | 6 +-- src/components/charts/BarChart.tsx | 2 +- src/components/charts/PieChart.tsx | 6 +-- src/components/icons/EtherLogoOutline.tsx | 4 +- src/components/icons/visaIcon.tsx | 4 +- src/components/rtl/dashboard/CheckTable.tsx | 2 +- src/components/sidebar/RTL.tsx | 2 +- .../sidebar/components/SidebarCard.tsx | 4 +- .../sidebar/componentsrtl/SidebarCard.tsx | 4 +- src/variables/charts.ts | 14 +++---- 18 files changed, 72 insertions(+), 67 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 9ad6ff4..4a8eece 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,15 @@ # Changelog +## [3.0.0] 2025-14-01 + +### Upgraded to React 19 ⚡️ + +### Upgraded to Next.js 15 ⚡️ + +- `` component adapted to SSR +- Fixed Apexcharts +- Cleaned props for multipel components + ## [2.1.0] 2024-06-19 ### Vulnerabilities removed diff --git a/README.md b/README.md index b549356..295259d 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,6 @@ # [Horizon UI Tailwind CSS NextJS ⚡️](https://horizon-ui.com/horizon-tailwind-react-nextjs) [![Tweet](https://img.shields.io/twitter/url/http/shields.io.svg?style=social&logo=twitter)](https://twitter.com/intent/tweet?text=Check%20Horizon%20UI,%20the%20trendiest%20open-source%20admin%20dashboard%20template%20for%20Tailwind%20CSS,%20React%20JS%20and%20NextJS%20-%20https%3A//horizon-ui.com/) -![version](https://img.shields.io/badge/version-2.1.0-blue.svg) +![version](https://img.shields.io/badge/version-3.0.0-blue.svg) ![license](https://img.shields.io/badge/license-MIT-blue.svg) [![GitHub issues open](https://img.shields.io/github/issues/horizon-ui/horizon-tailwind-react-nextjs.svg?maxAge=2592000)](https://github.com/horizon-ui/horizon-tailwind-react-nextjs/issues?q=is%3Aopen+is%3Aissue) diff --git a/next.config.js b/next.config.js index c945a1d..9c2c538 100644 --- a/next.config.js +++ b/next.config.js @@ -8,7 +8,6 @@ // '@fullcalendar/react', const nextConfig = { - swcMinify: true, basePath: process.env.NEXT_PUBLIC_BASE_PATH, assetPrefix: process.env.NEXT_PUBLIC_BASE_PATH, images: { @@ -20,9 +19,6 @@ const nextConfig = { // Make ENV unoptimized: true, }, - experimental: { - appDir: true, - }, }; module.exports = nextConfig; diff --git a/package.json b/package.json index 63c3748..0b52b61 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "horizon-tailwind-react-nextjs", - "version": "2.1.0", + "version": "3.0.0", "private": true, "dependencies": { "@chakra-ui/hooks": "^2.1.4", @@ -19,20 +19,20 @@ "@types/node": "^12.20.55", "@types/react": "^18.0.15", "@types/react-dom": "^18.0.6", - "apexcharts": "3.35.5", + "apexcharts": "^3.35.2", "framer-motion": "^7.10.2", - "react": "^18.2.0", - "react-apexcharts": "1.4.0", - "react-calendar": "^3.9.0", - "next": "^14.0.2", + "next": "^15.1.4", "next-transpile-modules": "^9.0.0", + "react": "^19.0.0-rc.1", + "react-apexcharts": "^1.4.0", + "react-calendar": "^3.9.0", "react-custom-scrollbars-2": "^4.2.1", - "react-dom": "^18.2.0", + "react-dom": "^19.0.0-rc.1", "react-icons": "^4.4.0", - "react-router-dom": "^6.4.0", "react-no-ssr": "^1.1.0", + "react-router-dom": "^6.4.0", "tailwindcss-rtl": "^0.9.0", - "typescript": "^4.7.4", + "typescript": "^4.9.4", "web-vitals": "^2.1.4" }, "scripts": { @@ -72,10 +72,11 @@ "@types/react-dom": "^18.2.1", "@types/react-no-ssr": "^1.1.3", "@types/react-router-dom": "^5.3.3", + "ajv": "^7.2.4", "autoprefixer": "^10.4.16", "css-loader": "^6.7.1", "eslint": "^8.23.0", - "eslint-config-next": "^13.3.2", + "eslint-config-next": "^15.1.4", "postcss": "^8.4.30", "prettier": "^2.8.3", "prettier-plugin-tailwindcss": "^0.2.1", diff --git a/src/app/admin/nft-marketplace/page.tsx b/src/app/admin/nft-marketplace/page.tsx index 0f7596a..0475859 100644 --- a/src/app/admin/nft-marketplace/page.tsx +++ b/src/app/admin/nft-marketplace/page.tsx @@ -56,7 +56,7 @@ const Marketplace = () => { className="text-base font-medium text-brand-500 hover:text-brand-500 dark:text-white" href=" " > - Sports + Sports diff --git a/src/components/admin/data-tables/CheckTable.tsx b/src/components/admin/data-tables/CheckTable.tsx index d441a4e..c1bfc7f 100644 --- a/src/components/admin/data-tables/CheckTable.tsx +++ b/src/components/admin/data-tables/CheckTable.tsx @@ -33,7 +33,7 @@ function CheckTable(props: { tableData: any }) {

diff --git a/src/components/admin/default/CheckTable.tsx b/src/components/admin/default/CheckTable.tsx index d9e0873..94154d2 100644 --- a/src/components/admin/default/CheckTable.tsx +++ b/src/components/admin/default/CheckTable.tsx @@ -1,7 +1,7 @@ -import React from "react"; -import CardMenu from "components/card/CardMenu"; -import Checkbox from "components/checkbox"; -import Card from "components/card"; +import React from 'react'; +import CardMenu from 'components/card/CardMenu'; +import Checkbox from 'components/checkbox'; +import Card from 'components/card'; import { createColumnHelper, @@ -10,7 +10,7 @@ import { getSortedRowModel, SortingState, useReactTable, -} from "@tanstack/react-table"; +} from '@tanstack/react-table'; type RowObj = { name: [string, boolean]; @@ -24,8 +24,8 @@ function CheckTable(props: { tableData: any }) { const [sorting, setSorting] = React.useState([]); let defaultData = tableData; const columns = [ - columnHelper.accessor("name", { - id: "name", + columnHelper.accessor('name', { + id: 'name', header: () => (

NAME

), @@ -33,7 +33,7 @@ function CheckTable(props: { tableData: any }) {

@@ -42,8 +42,8 @@ function CheckTable(props: { tableData: any }) {

), }), - columnHelper.accessor("progress", { - id: "progress", + columnHelper.accessor('progress', { + id: 'progress', header: () => (

PROGRESS @@ -55,8 +55,8 @@ function CheckTable(props: { tableData: any }) {

), }), - columnHelper.accessor("quantity", { - id: "quantity", + columnHelper.accessor('quantity', { + id: 'quantity', header: () => (

QUANTITY @@ -68,8 +68,8 @@ function CheckTable(props: { tableData: any }) {

), }), - columnHelper.accessor("date", { - id: "date", + columnHelper.accessor('date', { + id: 'date', header: () => (

DATE

), @@ -93,7 +93,7 @@ function CheckTable(props: { tableData: any }) { debugTable: true, }); return ( - +
Check Table @@ -118,11 +118,11 @@ function CheckTable(props: { tableData: any }) {
{flexRender( header.column.columnDef.header, - header.getContext() + header.getContext(), )} {{ - asc: "", - desc: "", + asc: '', + desc: '', }[header.column.getIsSorted() as string] ?? null}
@@ -146,7 +146,7 @@ function CheckTable(props: { tableData: any }) { > {flexRender( cell.column.columnDef.cell, - cell.getContext() + cell.getContext(), )} ); diff --git a/src/components/admin/default/DailyTraffic.tsx b/src/components/admin/default/DailyTraffic.tsx index ddc83ea..449b788 100644 --- a/src/components/admin/default/DailyTraffic.tsx +++ b/src/components/admin/default/DailyTraffic.tsx @@ -1,8 +1,8 @@ -import BarChart from "components/charts/BarChart"; -import { barChartDataDailyTraffic } from "variables/charts"; -import { barChartOptionsDailyTraffic } from "variables/charts"; -import { MdArrowDropUp } from "react-icons/md"; -import Card from "components/card"; +import BarChart from 'components/charts/BarChart'; +import { barChartDataDailyTraffic } from 'variables/charts'; +import { barChartOptionsDailyTraffic } from 'variables/charts'; +import { MdArrowDropUp } from 'react-icons/md'; +import Card from 'components/card'; const DailyTraffic = () => { return ( @@ -12,7 +12,7 @@ const DailyTraffic = () => { Daily Traffic

- 2.579{" "} + 2.579{' '} Visitors diff --git a/src/components/admin/default/PieChartCard.tsx b/src/components/admin/default/PieChartCard.tsx index f596303..0f78c90 100644 --- a/src/components/admin/default/PieChartCard.tsx +++ b/src/components/admin/default/PieChartCard.tsx @@ -1,6 +1,6 @@ -import PieChart from "components/charts/PieChart"; -import { pieChartData, pieChartOptions } from "variables/charts"; -import Card from "components/card"; +import PieChart from 'components/charts/PieChart'; +import { pieChartData, pieChartOptions } from 'variables/charts'; +import Card from 'components/card'; const PieChartCard = () => { return ( diff --git a/src/components/charts/BarChart.tsx b/src/components/charts/BarChart.tsx index 2139e0a..ad40638 100644 --- a/src/components/charts/BarChart.tsx +++ b/src/components/charts/BarChart.tsx @@ -5,7 +5,7 @@ const Chart = dynamic(() => import('react-apexcharts'), { ssr: false, }); -const BarChart = (props) => { +const BarChart = (props: any) => { const { chartData, chartOptions } = props; return ( diff --git a/src/components/charts/PieChart.tsx b/src/components/charts/PieChart.tsx index 9d1bd44..00d9dfb 100644 --- a/src/components/charts/PieChart.tsx +++ b/src/components/charts/PieChart.tsx @@ -5,14 +5,14 @@ const Chart = dynamic(() => import('react-apexcharts'), { ssr: false, }); -const LineChart = (props) => { +const PieChart = (props: any) => { const { chartData, chartOptions } = props; return ( // @ts-expect-error { ); }; -export default LineChart; +export default PieChart; diff --git a/src/components/icons/EtherLogoOutline.tsx b/src/components/icons/EtherLogoOutline.tsx index b2bec53..46e194d 100644 --- a/src/components/icons/EtherLogoOutline.tsx +++ b/src/components/icons/EtherLogoOutline.tsx @@ -4,8 +4,8 @@ function EtherLogoOutline() { return ( diff --git a/src/components/icons/visaIcon.tsx b/src/components/icons/visaIcon.tsx index f147ed6..b662a7b 100644 --- a/src/components/icons/visaIcon.tsx +++ b/src/components/icons/visaIcon.tsx @@ -8,8 +8,8 @@ const VisaIcon = () => { xmlns="http://www.w3.org/2000/svg" > diff --git a/src/components/rtl/dashboard/CheckTable.tsx b/src/components/rtl/dashboard/CheckTable.tsx index 98f07c4..ba2ac67 100644 --- a/src/components/rtl/dashboard/CheckTable.tsx +++ b/src/components/rtl/dashboard/CheckTable.tsx @@ -33,7 +33,7 @@ function CheckTable(props: { tableData: any }) {

diff --git a/src/components/sidebar/RTL.tsx b/src/components/sidebar/RTL.tsx index 864aaf9..6f6aa25 100644 --- a/src/components/sidebar/RTL.tsx +++ b/src/components/sidebar/RTL.tsx @@ -34,12 +34,12 @@ function SidebarHorizon(props: { variant?: string; [x: string]: any }) { - {/* @ts-expect-error */}

diff --git a/src/components/sidebar/components/SidebarCard.tsx b/src/components/sidebar/components/SidebarCard.tsx index 58fcd84..71beb4e 100644 --- a/src/components/sidebar/components/SidebarCard.tsx +++ b/src/components/sidebar/components/SidebarCard.tsx @@ -18,8 +18,8 @@ const FreeCard = () => { fill="white" /> diff --git a/src/components/sidebar/componentsrtl/SidebarCard.tsx b/src/components/sidebar/componentsrtl/SidebarCard.tsx index 58fcd84..71beb4e 100644 --- a/src/components/sidebar/componentsrtl/SidebarCard.tsx +++ b/src/components/sidebar/componentsrtl/SidebarCard.tsx @@ -18,8 +18,8 @@ const FreeCard = () => { fill="white" /> diff --git a/src/variables/charts.ts b/src/variables/charts.ts index f96670d..df68bb6 100644 --- a/src/variables/charts.ts +++ b/src/variables/charts.ts @@ -1,3 +1,7 @@ +import { ApexOptions } from 'apexcharts'; + +type ApexGeneric = ApexOptions & any; + export const barChartDataDailyTraffic = [ { name: 'Daily Traffic', @@ -5,7 +9,7 @@ export const barChartDataDailyTraffic = [ }, ]; -export const barChartOptionsDailyTraffic = { +export const barChartOptionsDailyTraffic: ApexGeneric = { chart: { toolbar: { show: false, @@ -15,7 +19,6 @@ export const barChartOptionsDailyTraffic = { style: { fontSize: '12px', fontFamily: undefined, - backgroundColor: '#000000', }, onDatasetHover: { style: { @@ -102,7 +105,7 @@ export const barChartOptionsDailyTraffic = { }, }; -export const pieChartOptions = { +export const pieChartOptions: ApexGeneric = { labels: ['Your files', 'System', 'Empty'], colors: ['#4318FF', '#6AD2FF', '#EFF4FB'], chart: { @@ -138,11 +141,6 @@ export const pieChartOptions = { tooltip: { enabled: true, theme: 'dark', - style: { - fontSize: '12px', - fontFamily: undefined, - backgroundColor: '#000000', - }, }, };