This commit is contained in:
Altair-sh 2025-03-19 01:02:28 +05:00
parent 94582a522b
commit 330016c516
5 changed files with 1067 additions and 956 deletions

1992
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -10,7 +10,10 @@
"format": "npx prettier src --write" "format": "npx prettier src --write"
}, },
"dependencies": { "dependencies": {
"ag-grid-community": "^33.1.1",
"ag-grid-react": "^33.1.1",
"next": "15.2", "next": "15.2",
"next-themes": "^0.4.6",
"react": "^19.0", "react": "^19.0",
"react-dom": "^19.0" "react-dom": "^19.0"
}, },

View File

@ -14,6 +14,7 @@ html,
body { body {
max-width: 100vw; max-width: 100vw;
overflow-x: hidden; overflow-x: hidden;
padding: 10px;
} }
@font-face { @font-face {

View File

@ -1,5 +1,6 @@
import type { Metadata } from 'next' import type { Metadata } from 'next'
import './globals.css' import './globals.css'
import { ModuleRegistry, AllCommunityModule } from 'ag-grid-community'
export const metadata: Metadata = { export const metadata: Metadata = {
title: 'Create Next App', title: 'Create Next App',
@ -11,6 +12,7 @@ export default function RootLayout({
}: Readonly<{ }: Readonly<{
children: React.ReactNode children: React.ReactNode
}>) { }>) {
ModuleRegistry.registerModules([AllCommunityModule])
return ( return (
<html lang="en"> <html lang="en">
<head> <head>

View File

@ -1,10 +1,29 @@
import Image from 'next/image' 'use client'
import { AgGridReact } from 'ag-grid-react'
import styles from './page.module.css' import styles from './page.module.css'
import { AllCommunityModule, themeQuartz } from 'ag-grid-community'
import { useMemo } from 'react'
import { colorSchemeDark } from 'ag-grid-community'
import { useTheme } from 'next-themes'
export default function Home() { export default function Home() {
const { theme } = useTheme()
const agTheme = useMemo(() => (theme === 'dark' ? themeQuartz.withPart(colorSchemeDark) : themeQuartz), [theme])
return ( return (
<div className={styles.page}> <div className={styles.page} style={{ height: '500px' }}>
<p>Hiii :3</p> <AgGridReact
theme={agTheme}
modules={[AllCommunityModule]}
rowData={[
{ id: 1, col1: 'Hello', col2: 'AG Grid' },
{ id: 2, col1: 'Dark Mode', col2: 'Support' },
]}
columnDefs={[
{ field: 'col1', headerName: 'Column 1', filter: 'agTextColumnFilter' },
{ field: 'col2', headerName: 'Column 2' },
]}
/>
</div> </div>
) )
} }