Merge pull request #30 from daniel-beranek/dev

Release

package.json

@@ -11,33 +11,35 @@
 		"generate-jira-types": "openapi-typescript https://dac-static.atlassian.com/cloud/jira/platform/swagger.v3.json -o src/types/jira.d.ts"
 	},
 	"dependencies": {
-		"@nextui-org/react": "^2.4.8",
-		"@react-aria/i18n": "^3.12.2",
+		"@heroui/react": "2.6.14",
+		"@internationalized/date": "3.6.0",
+		"@react-aria/i18n": "^3.12.5",
+		"@vercel/speed-insights": "^1.1.0",
 		"classnames": "^2.5.1",
-		"date-holidays": "^3.23.12",
-		"framer-motion": "^11.5.6",
-		"jose": "^5.9.2",
-		"next": "^14.2.13",
+		"date-holidays": "^3.23.20",
+		"framer-motion": "^11.18.2",
+		"jose": "^5.9.6",
+		"next": "^15.1.6",
 		"next-themes": "^0.3.0",
 		"react": "^18.3.1",
 		"react-dom": "^18.3.1",
-		"react-hot-toast": "^2.4.1",
+		"react-hot-toast": "^2.5.1",
 		"react-responsive": "^10.0.0",
 		"remark": "^15.0.1",
 		"remark-html": "^16.0.1"
 	},
 	"devDependencies": {
-		"@tailwindcss/typography": "^0.5.15",
-		"@types/node": "^20.16.5",
-		"@types/react": "^18.3.8",
-		"@types/react-dom": "^18.3.0",
+		"@tailwindcss/typography": "^0.5.16",
+		"@types/node": "^20.17.17",
+		"@types/react": "^18.3.18",
+		"@types/react-dom": "^18.3.5",
 		"eslint": "^8.57.1",
 		"eslint-config-next": "14.2.6",
-		"openapi-typescript": "^7.4.1",
-		"postcss": "^8.4.47",
-		"prettier": "^3.3.3",
-		"prettier-plugin-tailwindcss": "^0.6.6",
-		"tailwindcss": "^3.4.12",
-		"typescript": "^5.6.2"
+		"openapi-typescript": "^7.6.1",
+		"postcss": "^8.5.1",
+		"prettier": "^3.4.2",
+		"prettier-plugin-tailwindcss": "^0.6.11",
+		"tailwindcss": "^3.4.17",
+		"typescript": "^5.7.3"
 	}
 }

src/app/_components/Header.tsx

@@ -1,5 +1,5 @@
 'use client';
-import { Navbar, NavbarBrand, NavbarContent, NavbarItem, Link } from '@nextui-org/react';
+import { Navbar, NavbarBrand, NavbarContent, NavbarItem, Link } from "@heroui/react";
 import { usePathname } from 'next/navigation';
 
 export const Header = () => {

src/app/_components/Toast.tsx

@@ -1,7 +1,7 @@
 'use client';
 
-import { Card, CardBody, Progress } from '@nextui-org/react';
-import { CheckIcon, CloseFilledIcon } from '@nextui-org/shared-icons';
+import { Card, CardBody, Progress } from "@heroui/react";
+import { CheckIcon, CloseFilledIcon } from "@heroui/shared-icons";
 import { type Toast as ToastType } from 'react-hot-toast/headless';
 import { useEffect, useState } from 'react';
 

src/app/configuration/_components/CountryAutocomplete.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import { Autocomplete, AutocompleteItem, Skeleton } from '@nextui-org/react';
+import { Autocomplete, AutocompleteItem, Skeleton } from "@heroui/react";
 import { useLocalStorage } from '@/lib/hooks/useLocalStorage';
 import { useEffect, useMemo, useState } from 'react';
 import Holidays from 'date-holidays';

src/app/configuration/_components/TokenInput.tsx

@@ -1,8 +1,8 @@
 'use client';
 
-import { Button, Input, Skeleton, Spinner } from '@nextui-org/react';
+import { Button, Input, Skeleton, Spinner } from '@heroui/react';
 import { useCookieInput } from '@/app/configuration/_hooks/useCookieInput';
-import { EyeFilledIcon, EyeSlashFilledIcon, InfoIcon } from '@nextui-org/shared-icons';
+import { EyeFilledIcon, EyeSlashFilledIcon, InfoIcon } from '@heroui/shared-icons';
 import { useState } from 'react';
 
 export const TokenInput = () => {
@@ -56,7 +56,7 @@ export const TokenInput = () => {
 					}
 				/>
 				<Button
-					onClick={() => handleSubmit(value)}
+					onPress={() => handleSubmit(value)}
 					isDisabled={!description}
 					isLoading={isProcessingSubmit}
 					color="primary">

src/app/configuration/_components/UrlInput.tsx

@@ -1,8 +1,8 @@
 'use client';
 
-import { Button, Input, Skeleton, Spinner } from '@nextui-org/react';
+import { Button, Input, Skeleton, Spinner } from '@heroui/react';
 import { useCookieInput } from '@/app/configuration/_hooks/useCookieInput';
-import { InfoIcon } from '@nextui-org/shared-icons';
+import { InfoIcon } from '@heroui/shared-icons';
 import { toast } from 'react-hot-toast/headless';
 
 export const UrlInput = () => {
@@ -58,7 +58,7 @@ export const UrlInput = () => {
 					}
 				/>
 				<Button
-					onClick={() => onSubmit(value, handleSubmit)}
+					onPress={() => onSubmit(value, handleSubmit)}
 					isDisabled={!description}
 					isLoading={isProcessingSubmit}
 					color="primary">

src/app/configuration/_components/UserInput.tsx

@@ -1,8 +1,8 @@
 'use client';
 
-import { Button, Input, Skeleton, Spinner } from '@nextui-org/react';
+import { Button, Input, Skeleton, Spinner } from '@heroui/react';
 import { useCookieInput } from '@/app/configuration/_hooks/useCookieInput';
-import { InfoIcon } from '@nextui-org/shared-icons';
+import { InfoIcon } from '@heroui/shared-icons';
 
 export const UserInput = () => {
 	const { isLoaded, value, setValue, description, isProcessingValue, isProcessingSubmit, handleSubmit } =
@@ -41,7 +41,7 @@ export const UserInput = () => {
 					}
 				/>
 				<Button
-					onClick={() => handleSubmit(value)}
+					onPress={() => handleSubmit(value)}
 					isDisabled={!description}
 					isLoading={isProcessingSubmit}
 					color="primary">

src/app/configuration/page.tsx

@@ -1,4 +1,4 @@
-import { Card, CardBody, Kbd, CardFooter, Spacer } from '@nextui-org/react';
+import { Card, CardBody, Kbd, CardFooter, Spacer } from "@heroui/react";
 import { UrlInput } from './_components/UrlInput';
 import { UserInput } from './_components/UserInput';
 import { TokenInput } from './_components/TokenInput';

src/app/error.tsx

@@ -1,5 +1,5 @@
 'use client';
-import { Button, CardBody, Card } from '@nextui-org/react';
+import { Button, CardBody, Card } from '@heroui/react';
 
 const AppError = ({ reset }: Readonly<{ error: Error & { digest?: string }; reset: () => void }>) => {
 	return (
@@ -8,7 +8,7 @@ const AppError = ({ reset }: Readonly<{ error: Error & { digest?: string }; rese
 				<h2>Oops, uncaught error occurred 🐛</h2>
 				<Button
 					color="primary"
-					onClick={() => reset()}>
+					onPress={() => reset()}>
 					Try again
 				</Button>
 			</CardBody>

src/app/layout.tsx

@@ -5,6 +5,7 @@ import AppProviders from '@/app/providers';
 import { type ReactNode } from 'react';
 import { Toaster } from '@/app/_components/Toaster';
 import { Header } from '@/app/_components/Header';
+import { SpeedInsights } from '@vercel/speed-insights/next';
 
 const inter = Inter({ subsets: ['latin'] });
 
@@ -33,6 +34,7 @@ const AppLayout = ({
 					<main className="container mx-auto p-2">{children}</main>
 					<Toaster />
 				</AppProviders>
+				<SpeedInsights />
 			</body>
 		</html>
 	);

src/app/providers.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import { NextUIProvider } from '@nextui-org/react';
+import { HeroUIProvider } from "@heroui/react";
 import { type ReactNode, useEffect } from 'react';
 import { I18nProvider } from '@react-aria/i18n';
 import { useLocalStorage } from '@/lib/hooks/useLocalStorage';
@@ -14,13 +14,13 @@ const AppProviders = ({ children }: Readonly<{ children: ReactNode }>) => {
 
 	return (
 		<I18nProvider>
-			<NextUIProvider>
+			<HeroUIProvider>
 				<ThemeProvider
 					attribute="class"
 					enableSystem>
 					{children}
 				</ThemeProvider>
-			</NextUIProvider>
+			</HeroUIProvider>
 		</I18nProvider>
 	);
 };

src/app/worklogs/_actions/getWorklogs.tsx

@@ -80,7 +80,8 @@ export const getWorklogs: Action<Worklogs, 'dateStart' | 'dateEnd'> = async ({ d
 		const finalWorklogs: Worklogs = [];
 		const firstDate = new Date(dateStart);
 		const lastDate = new Date(dateEnd);
-		const holidays = new Holidays(cookies().get('holidayCountry')?.value ?? '');
+		const cookieStore = await cookies();
+		const holidays = new Holidays(cookieStore.get('holidayCountry')?.value ?? '');
 		let currentDate = firstDate;
 		if (firstDate > lastDate) {
 			return { status: 'error', errors: ['Start date cannot be after end date.'] };

src/app/worklogs/_components/IssuesAutocomplete.tsx

@@ -1,4 +1,4 @@
-import { Autocomplete, AutocompleteItem, AutocompleteSection } from '@nextui-org/react';
+import { Autocomplete, AutocompleteItem, AutocompleteSection } from "@heroui/react";
 import { useEffect, useState } from 'react';
 import { IssuePickerSections, searchIssues } from '@/app/worklogs/_actions/searchIssues';
 import { useDebounce } from '@/lib/hooks/useDebounce';

src/app/worklogs/_components/IssuesTableCell.tsx

@@ -1,4 +1,4 @@
-import { Button, Divider, Link, Popover, PopoverContent, PopoverTrigger, ScrollShadow } from '@nextui-org/react';
+import { Button, Divider, Link, Popover, PopoverContent, PopoverTrigger, ScrollShadow } from "@heroui/react";
 import { remark } from 'remark';
 import html from 'remark-html';
 import { Worklogs } from '@/app/worklogs/_actions/getWorklogs';

src/app/worklogs/_components/LogWorkTableCell.tsx

@@ -1,14 +1,5 @@
-import { EditIcon } from '@nextui-org/shared-icons';
-import {
-	Button,
-	Modal,
-	ModalBody,
-	ModalContent,
-	ModalFooter,
-	ModalHeader,
-	TimeInput,
-	DateInput
-} from '@nextui-org/react';
+import { EditIcon } from '@heroui/shared-icons';
+import { Button, Modal, ModalBody, ModalContent, ModalFooter, ModalHeader, TimeInput, DateInput } from '@heroui/react';
 
 import { LoggedWork, logWork } from '@/app/worklogs/_actions/logWork';
 import { Worklogs } from '@/app/worklogs/_actions/getWorklogs';
@@ -56,7 +47,7 @@ export const LogWorkTableCell = ({
 				isIconOnly
 				size="sm"
 				variant="flat"
-				onClick={() => {
+				onPress={() => {
 					setIsOpen(true);
 				}}>
 				<EditIcon />
@@ -83,7 +74,9 @@ export const LogWorkTableCell = ({
 								label="Time spent"
 								labelPlacement="outside"
 								value={timeValue}
-								onChange={setTimeValue}
+								onChange={(time) => {
+									if (time) setTimeValue(time);
+								}}
 							/>
 						</ModalBody>
 						<ModalFooter>

src/app/worklogs/_components/TableTopContent.tsx

@@ -1,4 +1,4 @@
-import { Button, ButtonGroup, DateRangePicker, Skeleton } from '@nextui-org/react';
+import { Button, ButtonGroup, DateRangePicker, Skeleton } from '@heroui/react';
 import { getWorklogs, type Worklogs } from '@/app/worklogs/_actions/getWorklogs';
 import { useEffect, useState } from 'react';
 import { useDateRange } from '@/app/worklogs/_hooks/useDateRange';
@@ -46,42 +46,44 @@ export const TableTopContent = ({
 					className="md:max-w-xs"
 					visibleMonths={screenSmallerThanSM ? 1 : 2}
 					value={dateRange}
-					onChange={setDateRange}
+					onChange={(date) => {
+						if (date) setDateRange(date);
+					}}
 				/>
 
 				<ButtonGroup
 					className="hidden sm:block"
 					variant="flat">
 					<Button
 						color={selectedDateRange === 'today' ? 'primary' : 'default'}
-						onClick={() => setDateRange('today')}>
+						onPress={() => setDateRange('today')}>
 						Today
 					</Button>
 					<Button
 						color={selectedDateRange === 'thisWeek' ? 'primary' : 'default'}
-						onClick={() => setDateRange('thisWeek')}>
+						onPress={() => setDateRange('thisWeek')}>
 						This week
 					</Button>
 					<Button
 						color={selectedDateRange === 'thisMonth' ? 'primary' : 'default'}
-						onClick={() => setDateRange('thisMonth')}>
+						onPress={() => setDateRange('thisMonth')}>
 						This month
 					</Button>
 					<Button
 						color={selectedDateRange === 'last15Days' ? 'primary' : 'default'}
-						onClick={() => setDateRange('last15Days')}>
+						onPress={() => setDateRange('last15Days')}>
 						Last 15 days
 					</Button>
 					<Button
 						color={selectedDateRange === 'last30Days' ? 'primary' : 'default'}
-						onClick={() => setDateRange('last30Days')}>
+						onPress={() => setDateRange('last30Days')}>
 						Last 30 days
 					</Button>
 				</ButtonGroup>
 
 				<Button
 					className="mr-auto sm:ml-auto sm:mr-0"
-					onClick={handleWorklogsFetch}
+					onPress={handleWorklogsFetch}
 					color="primary">
 					Load worklogs
 				</Button>

src/app/worklogs/_components/TimeSpentTableCell.tsx

@@ -1,5 +1,5 @@
 import { Worklogs } from '@/app/worklogs/_actions/getWorklogs';
-import { Progress } from '@nextui-org/react';
+import { Progress } from "@heroui/react";
 import { useMemo } from 'react';
 import { useLocale } from '@react-aria/i18n';
 

src/app/worklogs/_hooks/useDateRange.ts

@@ -1,5 +1,5 @@
 import { useEffect, useMemo, useState } from 'react';
-import type { DateValue, RangeValue } from '@nextui-org/react';
+import type { DateValue, RangeValue } from "@heroui/react";
 import {
 	endOfMonth,
 	endOfWeek,

src/app/worklogs/page.tsx

@@ -9,7 +9,7 @@ import {
 	TableHeader,
 	TableRow,
 	Skeleton
-} from '@nextui-org/react';
+} from "@heroui/react";
 import { useState, useMemo, useCallback } from 'react';
 import { DateTableCell } from '@/app/worklogs/_components/DateTableCell';
 import { TimeSpentTableCell } from '@/app/worklogs/_components/TimeSpentTableCell';

src/lib/actions/getDecryptedCookie.tsx

@@ -10,7 +10,8 @@ if (typeof COOKIE_SECRET === 'undefined') throw new Error('Missing COOKIE_SECRET
 const encodedSecret = new TextEncoder().encode(COOKIE_SECRET);
 
 export const getDecryptedCookie: Action<string, 'name'> = async ({ name }) => {
-	const encryptedCookie = cookies().get(name)?.value;
+	const cookieStore = await cookies();
+	const encryptedCookie = cookieStore.get(name)?.value;
 	if (typeof encryptedCookie === 'undefined') {
 		return {
 			errors: [

src/lib/actions/setEncryptedCookie.ts

@@ -11,14 +11,15 @@ const encodedSecret = new TextEncoder().encode(COOKIE_SECRET);
 
 export const setEncryptedCookie: Action<null, 'name' | 'value'> = async ({ name, value }) => {
 	const expirationDate = new Date(Date.now() + 365 * 24 * 60 * 60 * 1000);
+	const cookieStore = await cookies();
 
 	const encryptedValue = await new SignJWT({ value })
 		.setProtectedHeader({ alg: 'HS256' })
 		.setIssuedAt()
 		.setExpirationTime(expirationDate)
 		.sign(encodedSecret);
 
-	cookies().set(name, encryptedValue, {
+	cookieStore.set(name, encryptedValue, {
 		httpOnly: true,
 		secure: true,
 		expires: expirationDate,

tailwind.config.ts

@@ -1,17 +1,17 @@
 import type { Config } from 'tailwindcss';
-import { nextui } from '@nextui-org/react';
+import { heroui } from "@heroui/react";
 
 const config: Config = {
 	content: [
 		'./src/pages/**/*.{js,ts,jsx,tsx,mdx}',
 		'./src/components/**/*.{js,ts,jsx,tsx,mdx}',
 		'./src/app/**/*.{js,ts,jsx,tsx,mdx}',
-		'./node_modules/@nextui-org/theme/dist/**/*.{js,ts,jsx,tsx}'
+		"./node_modules/@heroui/theme/dist/**/*.{js,ts,jsx,tsx}"
 	],
 	theme: {
 		extend: {}
 	},
 	darkMode: 'class',
-	plugins: [nextui(), require('@tailwindcss/typography')]
+	plugins: [heroui(), require('@tailwindcss/typography')]
 };
 export default config;

tsconfig.json

@@ -21,7 +21,8 @@
 		],
 		"paths": {
 			"@/*": ["./src/*"]
-		}
+		},
+		"target": "ES2017"
 	},
 	"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
 	"exclude": ["node_modules"]