feat: ✨ restructured the project (#64)

* feat: ✨ restructured the project

* fix: 🐛 fixed lint errors

* docs: 📝 updated readme and dependencies

* chore: 🚀 updated deploy command

.github/CONTRIBUTING.md

@@ -1,4 +1,5 @@
 <!-- omit in toc -->
+
 # 🤝 Contributing to ultra-reporter-app
 
 First off, thanks for taking the time to contribute! ❤️
@@ -14,6 +15,7 @@ All types of contributions are encouraged and valued. See the [Table of Contents
 > - Mention the project at local meetups and tell your friends/colleagues
 
 <!-- omit in toc -->
+
 ## Table of Contents
 
 - [I Have a Question](#i-have-a-question)

.gitignore

@@ -1,7 +1,7 @@
 # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
 
 # dependencies
-/node_modules
+node_modules/
 /.pnp
 .pnp.js
 .yarn/install-state.gz
@@ -10,7 +10,7 @@
 /coverage
 
 # next.js
-/.next/
+.next/
 /out/
 
 # production
@@ -35,4 +35,6 @@ yarn-error.log*
 *.tsbuildinfo
 next-env.d.ts
 .env
-.changelog/
+.changelog/
+.turbo/
+dist/

.npmrc

@@ -0,0 +1,2 @@
+auto-install-peers = true
+enable-pre-post-scripts=true # Enable pre/post scripts (for postui:add)

.prettierignore

@@ -1,2 +1,6 @@
 *.md
-pnpm-lock.yaml
+pnpm-lock.yaml
+node_modules
+.next
+.turbo
+dist

.prettierrc.json

@@ -4,5 +4,5 @@
   "tabWidth": 2,
   "singleQuote": true,
   "jsxSingleQuote": true,
-  "plugins": ["prettier-plugin-tailwindcss"]
+  "plugins": ["prettier-plugin-organize-imports", "prettier-plugin-tailwindcss"]
 }

CHANGELOG.md

@@ -17,23 +17,27 @@
 ## 0.3.0 (2024-10-15)
 
 #### :rocket: New Feature
-* [#49](https://github.com/WasiqB/ultra-reporter-app/pull/49) feat: :sparkles: added theme toggle for light and dark mode ([@WasiqB](https://github.com/WasiqB))
+
+- [#49](https://github.com/WasiqB/ultra-reporter-app/pull/49) feat: :sparkles: added theme toggle for light and dark mode ([@WasiqB](https://github.com/WasiqB))
 
 #### Committers: 1
+
 - Wasiq Bhamla ([@WasiqB](https://github.com/WasiqB))
 
 ## 0.2.0 (2024-10-06)
 
 #### :rocket: New Feature
-* [#41](https://github.com/WasiqB/ultra-reporter-app/pull/41) feat: :sparkles: added skeleton when results page loading ([@WasiqB](https://github.com/WasiqB))
-* [#40](https://github.com/WasiqB/ultra-reporter-app/pull/40) feat: :sparkles: added google analytics ([@WasiqB](https://github.com/WasiqB))
-* [#38](https://github.com/WasiqB/ultra-reporter-app/pull/38) feat: :sparkles: added give feedback button on results page ([@WasiqB](https://github.com/WasiqB))
-* [#33](https://github.com/WasiqB/ultra-reporter-app/pull/33) feat: :sparkles: added test params related changes ([@WasiqB](https://github.com/WasiqB))
-* [#30](https://github.com/WasiqB/ultra-reporter-app/pull/30) feat: :sparkles: added groups column for the tests ([@WasiqB](https://github.com/WasiqB))
+
+- [#41](https://github.com/WasiqB/ultra-reporter-app/pull/41) feat: :sparkles: added skeleton when results page loading ([@WasiqB](https://github.com/WasiqB))
+- [#40](https://github.com/WasiqB/ultra-reporter-app/pull/40) feat: :sparkles: added google analytics ([@WasiqB](https://github.com/WasiqB))
+- [#38](https://github.com/WasiqB/ultra-reporter-app/pull/38) feat: :sparkles: added give feedback button on results page ([@WasiqB](https://github.com/WasiqB))
+- [#33](https://github.com/WasiqB/ultra-reporter-app/pull/33) feat: :sparkles: added test params related changes ([@WasiqB](https://github.com/WasiqB))
+- [#30](https://github.com/WasiqB/ultra-reporter-app/pull/30) feat: :sparkles: added groups column for the tests ([@WasiqB](https://github.com/WasiqB))
 
 #### :bug: Bug Fix
-* [#37](https://github.com/WasiqB/ultra-reporter-app/pull/37) fix: :bug: fixed date time formatting issue ([@WasiqB](https://github.com/WasiqB))
+
+- [#37](https://github.com/WasiqB/ultra-reporter-app/pull/37) fix: :bug: fixed date time formatting issue ([@WasiqB](https://github.com/WasiqB))
 
 #### Committers: 1
-- Wasiq Bhamla ([@WasiqB](https://github.com/WasiqB))
 
+- Wasiq Bhamla ([@WasiqB](https://github.com/WasiqB))

README.md

@@ -6,9 +6,9 @@ Built on the power of Next.js and Tailwind CSS, this reporter takes your raw tes
 
 ## 📷 Generated Report
 
-![Report page 1](/public/report-1.png)
-![Report page 2](/public/report-2.png)
-![Report page 3](/public/report-3.png)
+![Report page 1](/apps/web/public/report-1.png)
+![Report page 2](/apps/web/public/report-2.png)
+![Report page 3](/apps/web/public/report-3.png)
 
 ## 🚀 Quick start
 
@@ -19,8 +19,8 @@ Checkout this demo video to see how to use Ultra-Reporter:
 Following are the steps to get started with Ultra-Reporter:
 
 - Run your TestNG tests using it's default reporter listeners
-  - ![Step 1](/public/step-1.png)
-  - ![Step 2](/public/step-2.png)
+  - ![Step 1](/apps/web/public/step-1.png)
+  - ![Step 2](/apps/web/public/step-2.png)
 - Upload `testng-results.xml` from the `test-output` folder
 - Wait for the beautiful Test reports to get generated
 
@@ -40,6 +40,15 @@ We're constantly evolving! Check out the [Issues tab](https://github.com/WasiqB/
 
 Got a feature request or an idea to make Ultra-Reporter even better? Don’t hesitate to create [Feature or Enhancement request](https://github.com/WasiqB/ultra-reporter-app/discussions) – we’re always looking for ways to improve!
 
+## 🗂 Previous Versions
+
+Check out the previous versions of Ultra-Reporter to see what features were added in each release:
+
+- [Version 0.4.0](https://github.com/WasiqB/ultra-reporter-app/releases/tag/v0.4.0)
+- [Version 0.3.0](https://github.com/WasiqB/ultra-reporter-app/releases/tag/v0.3.0)
+- [Version 0.2.0](https://github.com/WasiqB/ultra-reporter-app/releases/tag/v0.2.0)
+- [Version 0.1.0](https://github.com/WasiqB/ultra-reporter-app/releases/tag/v0.1.0)
+
 ## 📞 Contact Me
 
 Feel free to reach out for any queries, collaborations, or feedback!
@@ -54,7 +63,7 @@ Feel free to reach out for any queries, collaborations, or feedback!
 
 [![Repo contributors](https://contrib.rocks/image?repo=wasiqb/ultra-reporter-app)](https://github.com/WasiqB/ultra-reporter-app/graphs/contributors)
 
-![Ultra Reporter App Repo activity](https://repobeats.axiom.co/api/embed/40bf4829da597315850c30a8909fcf40a8b5a00c.svg "Repobeats analytics image")
+![Ultra Reporter App Repo activity](https://repobeats.axiom.co/api/embed/40bf4829da597315850c30a8909fcf40a8b5a00c.svg 'Repobeats analytics image')
 
 ## 📜 License
 

app/(app)/layout.tsx → apps/web/app/(app)/layout.tsx

@@ -1,9 +1,9 @@
+import { GoogleTagManager } from '@next/third-parties/google';
+import '@ultra-reporter/ui/global.css';
+import { Footer } from '@ultra-reporter/ui/home/footer';
+import { ThemeProvider } from '@ultra-reporter/ui/utils/theme-provider';
 import type { Metadata } from 'next';
-import './globals.css';
 import { DetailedHTMLProps, HtmlHTMLAttributes } from 'react';
-import { Footer } from '@/components/home/footer';
-import { GoogleTagManager } from '@next/third-parties/google';
-import { ThemeProvider } from '@/components/utils/theme-provider';
 
 export const metadata: Metadata = {
   title: 'Ultra Reporter',

app/(app)/loading/page.tsx → apps/web/app/(app)/loading/page.tsx

@@ -1,20 +1,23 @@
 /* eslint-disable @stylistic/js/max-len */
 'use client';
 
-import { useEffect, useState } from 'react';
-import { useRouter } from 'next/navigation';
-import { convertToJson, getTestResults } from '@/lib/xml-parser';
-import { Progress } from '@/components/ui/progress';
+import { Button } from '@ultra-reporter/ui/components/button';
 import {
   Card,
   CardContent,
   CardFooter,
   CardHeader,
   CardTitle,
-} from '@/components/ui/card';
-import { Button } from '@/components/ui/button';
+} from '@ultra-reporter/ui/components/card';
+import { Progress } from '@ultra-reporter/ui/components/progress';
+import { getData } from '@ultra-reporter/ui/data';
+import {
+  convertToJson,
+  getTestResults,
+} from '@ultra-reporter/utils/xml-parser';
 import { Bug, MoveLeft } from 'lucide-react';
-import { getData } from '@/components/data-table/data';
+import { useRouter } from 'next/navigation';
+import { useEffect, useState } from 'react';
 
 const LoadingPage = (): JSX.Element => {
   const [progress, setProgress] = useState(0);
@@ -58,7 +61,7 @@ Stack: ${err.stack}`);
   };
 
   return (
-    <div className='flex min-h-screen items-center justify-center bg-background'>
+    <div className='bg-background flex min-h-screen items-center justify-center'>
       <Card className='w-[350px]'>
         <CardHeader>
           <CardTitle>Processing XML</CardTitle>
@@ -67,11 +70,11 @@ Stack: ${err.stack}`);
           <Progress value={progress} className='w-full' />
           {error ? (
             <div className='mt-4'>
-              <h3 className='mb-2 font-semibold text-destructive'>Error:</h3>
-              <p className='mb-4 text-sm text-muted-foreground'>{error}</p>
+              <h3 className='text-destructive mb-2 font-semibold'>Error:</h3>
+              <p className='text-muted-foreground mb-4 text-sm'>{error}</p>
             </div>
           ) : (
-            <p className='mt-4 text-muted-foreground'>
+            <p className='text-muted-foreground mt-4'>
               Please wait while we process your XML file...
             </p>
           )}

app/(app)/page.tsx → apps/web/app/(app)/page.tsx

@@ -1,17 +1,15 @@
-import * as React from 'react';
-
-import { FileUpload } from '@/components/utils/file-upload';
-import { OpenSource } from '@/components/home/open-source';
-import { NavBar } from '@/components/home/nav-bar';
-import { Features } from '@/components/home/feature';
-import { Sponsor } from '@/components/home/sponsor';
-import { Feedback } from '@/components/home/feedback';
+import { Features } from '@ultra-reporter/ui/home/feature';
+import { Feedback } from '@ultra-reporter/ui/home/feedback';
+import { NavBar } from '@ultra-reporter/ui/home/nav-bar';
+import { OpenSource } from '@ultra-reporter/ui/home/open-source';
+import { Sponsor } from '@ultra-reporter/ui/home/sponsor';
+import { FileUpload } from '@ultra-reporter/ui/utils/file-upload';
 
 const LandingPage = (): JSX.Element => {
   return (
     <>
       <NavBar />
-      <main className='container mx-auto flex-grow bg-background px-4 py-16 text-foreground'>
+      <main className='bg-background text-foreground container mx-auto flex-grow px-4 py-16'>
         <div className='flex flex-col items-center pt-16 text-center'>
           <h2 className='gradient-text text-3xl font-bold md:text-5xl'>
             Ultra Reporter

app/(app)/results/page.tsx → apps/web/app/(app)/results/page.tsx

@@ -1,30 +1,29 @@
 'use client';
 
-import * as React from 'react';
-import { useState, useEffect } from 'react';
-import { FormattedData } from '@/types/types';
 import {
   ColumnFiltersState,
   SortingState,
   VisibilityState,
 } from '@tanstack/react-table';
-import { DataTable } from '@/components/data-table/data-table';
+import { AreaChartComponent } from '@ultra-reporter/ui/charts/area-chart';
+import { DoughNutComponent } from '@ultra-reporter/ui/charts/dough-nut-chart';
+import { PieComponent } from '@ultra-reporter/ui/charts/pie-chart';
 import {
   Card,
   CardContent,
   CardDescription,
   CardHeader,
   CardTitle,
-} from '@/components/ui/card';
-import { Skeleton } from '@/components/ui/skeleton';
-import { ChartConfig } from '@/components/ui/chart';
-import DoughNutComponent from '@/components/charts/dough-nut-chart';
-import { TestResultData, getFormattedData } from '@/components/data-table/data';
-import { columns } from '@/components/data-table/columns';
-import { PieComponent } from '@/components/charts/pie-chart';
-import { NavBar } from '@/components/home/nav-bar';
-import { cn } from '@/lib/utils';
-import { AreaChartComponent } from '@/components/charts/area-chart';
+} from '@ultra-reporter/ui/components/card';
+import { ChartConfig } from '@ultra-reporter/ui/components/chart';
+import { Skeleton } from '@ultra-reporter/ui/components/skeleton';
+import { getFormattedData, TestResultData } from '@ultra-reporter/ui/data';
+import { DataTable } from '@ultra-reporter/ui/data-table/data-table';
+import { columns } from '@ultra-reporter/ui/data-table/table/columns';
+import { NavBar } from '@ultra-reporter/ui/home/nav-bar';
+import { cn } from '@ultra-reporter/utils/cn';
+import { FormattedData } from '@ultra-reporter/utils/types';
+import { useEffect, useState } from 'react';
 
 const chartConfig: ChartConfig = {
   total: {
@@ -85,7 +84,7 @@ const ResultsPage = (): JSX.Element => {
   } = formattedData || {};
 
   return (
-    <div className='flex min-h-screen flex-col bg-background text-foreground'>
+    <div className='bg-background text-foreground flex min-h-screen flex-col'>
       <NavBar
         suffix={`for ${isLoading ? '...' : date}`}
         cta='Generate new Report'

next.config.mjs → apps/web/next.config.mjs

@@ -1,4 +1,6 @@
 /** @type {import('next').NextConfig} */
-const nextConfig = {};
+const nextConfig = {
+  transpilePackages: ['@ultra-reporter/ui'],
+};
 
 export default nextConfig;

apps/web/package.json

@@ -0,0 +1,30 @@
+{
+  "name": "ultra-reporter-app",
+  "description": "Ultra Reporter App",
+  "version": "0.4.0",
+  "private": true,
+  "license": "AGPL-3.0-or-later",
+  "scripts": {
+    "dev": "next dev --turbo",
+    "build": "next build",
+    "start": "next start"
+  },
+  "dependencies": {
+    "@next/third-parties": "^14.2.15",
+    "@tanstack/react-table": "^8.20.5",
+    "@ultra-reporter/ui": "workspace:*",
+    "@ultra-reporter/utils": "workspace:*",
+    "lucide-react": "^0.453.0",
+    "next": "14.2.15",
+    "react": "^18",
+    "react-dom": "^18"
+  },
+  "devDependencies": {
+    "@types/react": "^18.3.12",
+    "@types/react-dom": "^18",
+    "@ultra-reporter/tailwind-config": "workspace:*",
+    "@ultra-reporter/typescript-config": "workspace:*",
+    "postcss": "^8",
+    "tailwindcss": "^3.4.14"
+  }
+}

apps/web/postcss.config.mjs

@@ -0,0 +1 @@
+export { default } from '@ultra-reporter/tailwind-config/postcss.config';

apps/web/tailwind.config.ts

@@ -0,0 +1 @@
+export * from '@ultra-reporter/tailwind-config/tailwind.config';

apps/web/tsconfig.json

@@ -0,0 +1,11 @@
+{
+  "extends": "@ultra-reporter/typescript-config/nextjs.json",
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["./*"]
+    }
+  },
+  "include": ["next-env.d.ts", ".next/types/**/*.ts", "**/*.ts", "**/*.tsx"],
+  "exclude": ["node_modules"]
+}

eslint.config.mjs

@@ -1,14 +1,14 @@
-import stylisticTs from '@stylistic/eslint-plugin-ts';
+import { includeIgnoreFile } from '@eslint/compat';
+import js from '@eslint/js';
 import stylisticJs from '@stylistic/eslint-plugin-js';
+import stylisticTs from '@stylistic/eslint-plugin-ts';
 import tsParser from '@typescript-eslint/parser';
-import js from '@eslint/js';
 import prettierRecommended from 'eslint-plugin-prettier/recommended';
-import tseslint from 'typescript-eslint';
 import react from 'eslint-plugin-react';
 import globals from 'globals';
-import { includeIgnoreFile } from '@eslint/compat';
 import path from 'node:path';
 import { fileURLToPath } from 'node:url';
+import tseslint from 'typescript-eslint';
 
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
@@ -33,7 +33,7 @@ export default [
         },
       },
     },
-    files: ['**/*.{js,mjs,ts,tsx}'],
+    files: ['./apps/**/*.{js,mjs,ts,tsx}', './packages/**/*.{js,mjs,ts,tsx}'],
     plugins: {
       '@stylistic/ts': stylisticTs,
       '@stylistic/js': stylisticJs,
@@ -65,7 +65,7 @@ export default [
   },
   {
     ignores: [
-      'components/ui/',
+      'packages/ui/src/components/',
       'components/icons',
       'assets/',
       '.github/',