chore: release v2.2.0

This version seems to be broken.
In dev mode, styled component theme props's missing only when SSR

.editorconfig

@@ -3,7 +3,7 @@
 root = true
 
 [*]
-indent_style = space
+indent_style = tab
 indent_size = 2
 end_of_line = lf
 charset = utf-8
@@ -17,8 +17,5 @@ insert_final_newline = unset
 indent_style = unset
 insert_final_newline = unset
 
-[MakeFile]
-indent_style = space
-
 [*.md]
 trim_trailing_whitespace = false

.husky/pre-commit

@@ -1,4 +1 @@
-#!/usr/bin/env sh
-. "$(dirname -- "$0")/_/husky.sh"
-
 npx lint-staged

.vscode/settings.json

@@ -1,3 +1,13 @@
 {
-  "typescript.preferences.importModuleSpecifier": "non-relative"
+	"typescript.preferences.importModuleSpecifier": "non-relative",
+	/* Prefer tabs over spaces for accessibility */
+	"editor.insertSpaces": false,
+	"editor.detectIndentation": false,
+	/* Explorer */
+	"explorer.fileNesting.enabled": true,
+	"explorer.fileNesting.patterns": {
+		"*.js": "${capture}.js.map, ${capture}.min.js, ${capture}.d.ts",
+		"package.json": "pnpm-lock.yaml, tsconfig.json, eslint.config.js, .babelrc, vite.config.ts, .editorconfig",
+		"Makefile": "*compose.yml, Dockerfile, servers_pgadmin.json, .dockerignore"
+	}
 }

Makefile

@@ -1,11 +1,13 @@
 dev:
 	@docker compose down
-	@docker compose -f dev.docker-compose.yml up -d --wait
+	@docker compose -f dev.compose.yml pull
+	@docker compose -f dev.compose.yml up -d --wait
 	@node ace migration:fresh
 	@pnpm run dev
 
 prod:
-	@docker compose -f dev.docker-compose.yml down
+	@docker compose -f dev.compose.yml down
+	@docker compose pull
 	@docker compose up -d --build --wait
 
 seed:
@@ -13,7 +15,7 @@ seed:
 
 down:
 	@-docker compose down
-	@-docker compose -f dev.docker-compose.yml down
+	@-docker compose -f dev.compose.yml down
 
 release:
 	@pnpm run release

ace.js

@@ -19,8 +19,7 @@
 /**
  * Register hook to process TypeScript files using ts-node
  */
-import { register } from 'node:module';
-register('ts-node/esm', import.meta.url);
+import 'ts-node-maintained/register/esm';
 
 /**
  * Import ace console entrypoint

app/controllers/admin_controller.ts

@@ -16,10 +16,9 @@ class UserWithRelationCountDto {
 		isAdmin: this.user.isAdmin,
 		createdAt: this.user.createdAt,
 		updatedAt: this.user.updatedAt,
-    count: {
-      link: Number(this.user.$extras.totalLinks),
-      collection: Number(this.user.$extras.totalCollections),
-    },
+		lastSeenAt: this.user.lastSeenAt,
+		linksCount: Number(this.user.$extras.totalLinks),
+		collectionsCount: Number(this.user.$extras.totalCollections),
 	});
 }
 

app/controllers/collections_controller.ts

@@ -25,9 +25,11 @@ export default class CollectionsController {
 			return response.redirectToNamedRoute('dashboard');
 		}
 
+		// TODO: Create DTOs
 		return inertia.render('dashboard', {
-      collections,
-      activeCollection: activeCollection || collections[0],
+			collections: collections.map((collection) => collection.serialize()),
+			activeCollection:
+				activeCollection?.serialize() || collections[0].serialize(),
 		});
 	}
 

app/middleware/silent_auth_middleware.ts

@@ -0,0 +1,9 @@
+import type { HttpContext } from '@adonisjs/core/http';
+import type { NextFn } from '@adonisjs/core/types/http';
+
+export default class SilentAuthMiddleware {
+	async handle(ctx: HttpContext, next: NextFn) {
+		await ctx.auth.check();
+		return next();
+	}
+}

app/middleware/update_user_last_seen_middleware.ts

@@ -0,0 +1,16 @@
+import type { HttpContext } from '@adonisjs/core/http';
+import type { NextFn } from '@adonisjs/core/types/http';
+import { DateTime } from 'luxon';
+
+export default class UpdateUserLastSeenMiddleware {
+	async handle(ctx: HttpContext, next: NextFn) {
+		const user = ctx.auth.user;
+		if (user) {
+			user.lastSeenAt = DateTime.local();
+			await user.save();
+		}
+
+		const output = await next();
+		return output;
+	}
+}

app/models/user.ts

@@ -4,6 +4,7 @@ import type { GoogleToken } from '@adonisjs/ally/types';
 import { column, computed, hasMany } from '@adonisjs/lucid/orm';
 import type { HasMany } from '@adonisjs/lucid/types/relations';
 import AppBaseModel from './app_base_model.js';
+import { DateTime } from 'luxon';
 
 export default class User extends AppBaseModel {
 	@column()
@@ -44,4 +45,10 @@ export default class User extends AppBaseModel {
 	get fullname() {
 		return this.nickName || this.name;
 	}
+
+	@column.dateTime({
+		autoCreate: true,
+		autoUpdate: true,
+	})
+	declare lastSeenAt: DateTime;
 }

compose.yml

@@ -17,7 +17,7 @@ services:
 
   pgadmin:
     container_name: pgadmin
-    image: dpage/pgadmin4:8.6
+    image: dpage/pgadmin4:8
     restart: always
     healthcheck:
       test: ['CMD', 'wget', '-O', '-', 'http://localhost:80/misc/ping']

database/migrations/1714218548323_create_users_table.ts

@@ -5,7 +5,14 @@ export default class CreateUsersTable extends BaseSchema {
 	static tableName = 'users';
 
 	async up() {
-    this.schema.createTableIfNotExists(CreateUsersTable.tableName, (table) => {
+		const exists = await this.schema.hasTable(CreateUsersTable.tableName);
+		if (exists) {
+			return console.warn(
+				`Table ${CreateUsersTable.tableName} already exists.`
+			);
+		}
+
+		this.schema.createTable(CreateUsersTable.tableName, (table) => {
 			table.string('email', 254).notNullable().unique();
 			table.string('name', 254).notNullable();
 			table.string('nick_name', 254).nullable();

database/migrations/1714253983443_create_collections_table.ts

@@ -8,9 +8,14 @@ export default class CreateCollectionTable extends BaseSchema {
 
 	async up() {
 		this.schema.raw(`DROP TYPE IF EXISTS ${this.visibilityEnumName}`);
-    this.schema.createTableIfNotExists(
-      CreateCollectionTable.tableName,
-      (table) => {
+		const exists = await this.schema.hasTable(CreateCollectionTable.tableName);
+		if (exists) {
+			return console.warn(
+				`Table ${CreateCollectionTable.tableName} already exists.`
+			);
+		}
+
+		this.schema.createTable(CreateCollectionTable.tableName, (table) => {
 			table.string('name', 254).notNullable();
 			table.string('description', 254).nullable();
 			table
@@ -33,8 +38,7 @@ export default class CreateCollectionTable extends BaseSchema {
 				.onDelete('CASCADE');
 
 			defaultTableFields(table);
-      }
-    );
+		});
 	}
 
 	async down() {

database/migrations/1714254076754_create_links_table.ts

@@ -5,7 +5,13 @@ export default class CreateLinksTable extends BaseSchema {
 	static tableName = 'links';
 
 	async up() {
-    this.schema.createTableIfNotExists(CreateLinksTable.tableName, (table) => {
+		const exists = await this.schema.hasTable(CreateLinksTable.tableName);
+		if (exists) {
+			return console.warn(`Table ${CreateLinksTable.tableName} already
+			exists.`);
+		}
+
+		this.schema.createTable(CreateLinksTable.tableName, (table) => {
 			table.string('name', 254).notNullable();
 			table.string('description', 254).nullable();
 			table.text('url').notNullable();

database/migrations/1728257868871_update_user_last_seens_table.ts

@@ -0,0 +1,15 @@
+import { BaseSchema } from '@adonisjs/lucid/schema';
+
+export default class extends BaseSchema {
+	protected tableName = 'users';
+
+	async up() {
+		this.schema.alterTable(this.tableName, (table) => {
+			table.timestamp('last_seen_at');
+		});
+	}
+
+	async down() {
+		this.schema.dropTable(this.tableName);
+	}
+}

dev.compose.yml

@@ -17,7 +17,7 @@ services:
 
   pgadmin:
     container_name: pgadmin
-    image: dpage/pgadmin4:8.6
+    image: dpage/pgadmin4:8
     restart: always
     environment:
       - PGADMIN_DEFAULT_EMAIL=myemail@gmail.com

eslint.config.js

@@ -0,0 +1,4 @@
+import { configApp } from '@adonisjs/eslint-config';
+export default configApp({
+  files: ['**/*.ts', '**/*.tsx', '**/*.js', '**/*.jsx'],
+});

inertia/components/common/table.tsx

@@ -6,6 +6,7 @@ import {
 	getPaginationRowModel,
 	getSortedRowModel,
 	PaginationState,
+	SortingState,
 	useReactTable,
 } from '@tanstack/react-table';
 import { useState } from 'react';
@@ -50,13 +51,19 @@ const Resizer = styled.div<{ isResizing: boolean }>(
 type TableProps<T> = {
 	columns: ColumnDef<T>[];
 	data: T[];
+	defaultSorting?: SortingState;
 };
 
-export default function Table<T>({ columns, data }: TableProps<T>) {
+export default function Table<T>({
+	columns,
+	data,
+	defaultSorting = [],
+}: TableProps<T>) {
 	const [pagination, setPagination] = useState<PaginationState>({
 		pageIndex: 0,
 		pageSize: 10,
 	});
+	const [sorting, setSorting] = useState<SortingState>(defaultSorting);
 
 	const table = useReactTable({
 		data,
@@ -65,11 +72,13 @@ export default function Table<T>({ columns, data }: TableProps<T>) {
 		columnResizeMode: 'onChange',
 		state: {
 			pagination,
+			sorting,
 		},
 		onPaginationChange: setPagination,
 		getCoreRowModel: getCoreRowModel(),
 		getPaginationRowModel: getPaginationRowModel(),
 		getSortedRowModel: getSortedRowModel(),
+		onSortingChange: setSorting,
 		debugTable: true,
 	});
 

inertia/components/dashboard/dashboard_provider.tsx

@@ -80,6 +80,7 @@ export default function DashboardProviders(
 			enabled: globalHotkeysEnabled,
 		}
 	);
+
 	return (
 		<CollectionsContext.Provider value={collectionsContextValue}>
 			<ActiveCollectionContext.Provider value={activeCollectionContextValue}>

inertia/components/dashboard/search/search_result_item.tsx

@@ -15,7 +15,7 @@ const SearchItemStyle = styled('li', {
 	shouldForwardProp: (propName) => propName !== 'isActive',
 })<{ isActive: boolean }>(({ theme, isActive }) => ({
 	fontSize: '16px',
-  backgroundColor: isActive ? theme.colors.background : 'transparent',
+	backgroundColor: isActive ? theme.colors.secondary : 'transparent',
 	display: 'flex',
 	gap: '0.35em',
 	alignItems: 'center',

inertia/components/dashboard/side_nav/favorite/favorite_item.tsx

@@ -16,6 +16,7 @@ import { appendCollectionId, appendLinkId } from '~/lib/navigation';
 import { LinkWithCollection } from '~/types/app';
 
 const FavoriteItemStyle = styled(ItemExternalLink)(({ theme }) => ({
+	height: 'auto',
 	backgroundColor: theme.colors.secondary,
 }));
 
@@ -23,13 +24,20 @@ const FavoriteDropdown = styled(Dropdown)(({ theme }) => ({
 	backgroundColor: theme.colors.secondary,
 }));
 
+const FavoriteContainer = styled.div({
+	flex: 1,
+	lineHeight: '1.1rem',
+});
+
 export default function FavoriteItem({ link }: { link: LinkWithCollection }) {
 	const { t } = useTranslation();
 	return (
 		<FavoriteItemStyle href={link.url}>
 			<LinkFavicon url={link.url} size={24} />
+			<FavoriteContainer>
 				<TextEllipsis>{link.name}</TextEllipsis>
-      <Legend>({link.collection.name})</Legend>
+				<Legend>{link.collection.name}</Legend>
+			</FavoriteContainer>
 			<FavoriteDropdown
 				onClick={(event) => {
 					event.preventDefault();

inertia/components/settings/profile.tsx

@@ -14,7 +14,7 @@ const ProfileStyle = styled(UnstyledList)({
 	gap: '1.25em',
 });
 
-const Column = styled.li({
+const Column = styled.div({
 	display: 'flex',
 	gap: '1rem',
 	flexDirection: 'column',

inertia/i18n/locales/en/admin.json

@@ -1,7 +1,7 @@
 {
 	"role": "Role",
 	"created_at": "Created at",
-  "updated_at": "Updated at",
+	"last_seen_at": "Last seen at",
 	"admin": "Administrator",
 	"user": "User",
 	"users": "Users",

inertia/i18n/locales/fr/admin.json

@@ -1,7 +1,7 @@
 {
 	"role": "Rôle",
 	"created_at": "Création",
-  "updated_at": "Mise à jour",
+	"last_seen_at": "Dernière connexion",
 	"admin": "Administrateur",
 	"user": "Utilisateur",
 	"users": "Utilisateurs",

inertia/pages/admin/dashboard.tsx

@@ -51,7 +51,7 @@ function AdminDashboard({
 			[
 				{
 					accessorKey: 'id',
-          header: (
+					header: () => (
 						<>
 							# <span css={{ color: theme.colors.grey }}>({users.length})</span>
 						</>
@@ -69,8 +69,8 @@ function AdminDashboard({
 					cell: (info) => info.getValue(),
 				},
 				{
-          accessorKey: 'count',
-          header: (
+					accessorKey: 'collectionsCount',
+					header: () => (
 						<>
 							{t('common:collection.collections', { count: totalCollections })}{' '}
 							<span css={{ color: theme.colors.grey }}>
@@ -78,17 +78,17 @@ function AdminDashboard({
 							</span>
 						</>
 					),
-          cell: (info) => (info.getValue() as any)?.collection,
+					cell: (info) => info.getValue(),
 				},
 				{
-          accessorKey: 'count',
-          header: (
+					accessorKey: 'linksCount',
+					header: () => (
 						<>
 							{t('common:link.links', { count: totalLinks })}{' '}
 							<span css={{ color: theme.colors.grey }}>({totalLinks})</span>
 						</>
 					),
-          cell: (info: any) => info.getValue()?.link,
+					cell: (info: any) => info.getValue(),
 				},
 				{
 					accessorKey: 'isAdmin',
@@ -110,12 +110,23 @@ function AdminDashboard({
 					cell: RenderDateCell,
 				},
 				{
-          accessorKey: 'updatedAt',
-          header: t('admin:updated_at'),
+					accessorKey: 'lastSeenAt',
+					header: t('admin:last_seen_at'),
 					cell: RenderDateCell,
 				},
-      ] as ColumnDef<UserWithRelationCount>[],
+			] satisfies ColumnDef<UserWithRelationCount>[],
 		[]
 	);
-  return <Table columns={columns} data={users} />;
+	return (
+		<Table
+			columns={columns}
+			data={users}
+			defaultSorting={[
+				{
+					id: 'lastSeenAt',
+					desc: true,
+				},
+			]}
+		/>
+	);
 }

inertia/types/app.d.ts

@@ -24,10 +24,9 @@ type UserWithRelationCount = CommonBase & {
 	fullname: string;
 	avatarUrl: string;
 	isAdmin: string;
-  count: {
-    link: number;
-    collection: number;
-  };
+	linksCount: number;
+	collectionsCount: number;
+	lastSeenAt: string;
 };
 
 type Link = CommonBase & {

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "my-links",
-  "version": "2.1.0",
+	"version": "2.2.0",
 	"type": "module",
 	"license": "UNLICENSED",
 	"scripts": {
@@ -8,7 +8,7 @@
 		"build": "node ace build",
 		"dev": "node ace serve --watch",
 		"test": "node ace test",
-    "lint": "eslint . --ext .ts,.tsx --report-unused-disable-directives --max-warnings 0",
+		"lint": "eslint . --report-unused-disable-directives --max-warnings 0",
 		"format": "prettier --write --parser typescript '**/*.{ts,tsx}'",
 		"typecheck": "tsc --noEmit",
 		"prepare": "husky",
@@ -36,67 +36,68 @@
 		"#lib/*": "./app/lib/*.js"
 	},
 	"devDependencies": {
-    "@adonisjs/assembler": "^7.7.0",
-    "@adonisjs/eslint-config": "^1.3.0",
-    "@adonisjs/tsconfig": "^1.3.0",
+		"@adonisjs/assembler": "^7.8.2",
+		"@adonisjs/eslint-config": "2.0.0-beta.6",
+		"@adonisjs/prettier-config": "^1.4.0",
+		"@adonisjs/tsconfig": "^1.4.0",
 		"@emotion/babel-plugin": "^11.12.0",
-    "@faker-js/faker": "^8.4.1",
+		"@faker-js/faker": "^9.0.3",
 		"@japa/assert": "^3.0.0",
 		"@japa/plugin-adonisjs": "^3.0.1",
 		"@japa/runner": "^3.1.4",
-    "@swc/core": "^1.7.22",
+		"@swc/core": "^1.7.26",
 		"@types/luxon": "^3.4.2",
 		"@types/node": "^20.14.10",
-    "@types/react": "^18.3.5",
+		"@types/react": "^18.3.11",
 		"@types/react-dom": "^18.3.0",
 		"@types/react-toggle": "^4.0.5",
-    "@typescript-eslint/eslint-plugin": "^7.15.0",
-    "@vitejs/plugin-react": "^4.3.1",
-    "eslint": "^8.57.0",
-    "hot-hook": "^0.2.6",
-    "husky": "^9.1.5",
-    "lint-staged": "^15.2.9",
+		"@typescript-eslint/eslint-plugin": "^8.8.0",
+		"@vitejs/plugin-react": "^4.3.2",
+		"eslint": "^9.12.0",
+		"hot-hook": "^0.3.0",
+		"husky": "^9.1.6",
+		"lint-staged": "^15.2.10",
 		"pino-pretty": "^11.2.2",
 		"prettier": "^3.3.3",
-    "release-it": "^17.6.0",
-    "ts-node": "^10.9.2",
+		"release-it": "^17.7.0",
+		"ts-node-maintained": "^10.9.4",
 		"typescript": "~5.5.4",
-    "vite": "^5.4.2"
+		"vite": "^5.4.8"
 	},
 	"dependencies": {
 		"@adonisjs/ally": "^5.0.2",
 		"@adonisjs/auth": "^9.2.3",
-    "@adonisjs/core": "^6.12.1",
+		"@adonisjs/core": "^6.14.0",
 		"@adonisjs/cors": "^2.2.1",
-    "@adonisjs/inertia": "^1.1.0",
+		"@adonisjs/inertia": "^1.2.2",
 		"@adonisjs/lucid": "^21.2.0",
-    "@adonisjs/session": "^7.4.2",
+		"@adonisjs/session": "^7.5.0",
 		"@adonisjs/shield": "^8.1.1",
 		"@adonisjs/static": "^1.1.1",
 		"@adonisjs/vite": "^3.0.0",
-    "@emotion/react": "^11.13.3",
+		"@emotion/react": "11.12.0",
 		"@emotion/styled": "^11.13.0",
 		"@inertiajs/react": "^1.2.0",
-    "@izzyjs/route": "^1.1.0-0",
+		"@izzyjs/route": "^1.2.0",
 		"@tanstack/react-table": "^8.20.5",
 		"@vinejs/vine": "^2.1.0",
 		"bentocache": "^1.0.0-beta.9",
 		"dayjs": "^1.11.13",
-    "edge.js": "^6.0.2",
+		"edge.js": "^6.2.0",
 		"hex-rgb": "^5.0.0",
-    "i18next": "^23.14.0",
+		"i18next": "^23.15.2",
 		"knex": "^3.1.0",
 		"luxon": "^3.5.0",
 		"node-html-parser": "^6.1.13",
-    "pg": "^8.12.0",
+		"pg": "^8.13.0",
 		"react": "^18.3.1",
 		"react-dnd": "^16.0.1",
 		"react-dnd-html5-backend": "^16.0.1",
 		"react-dom": "^18.3.1",
-    "react-hotkeys-hook": "^4.5.0",
-    "react-i18next": "^14.1.2",
+		"react-hotkeys-hook": "^4.5.1",
+		"react-i18next": "^15.0.2",
 		"react-icons": "^5.3.0",
-    "react-select": "^5.8.0",
+		"react-select": "^5.8.1",
 		"react-swipeable": "^7.0.1",
 		"react-toggle": "^4.1.3",
 		"reflect-metadata": "^0.2.2"
@@ -107,14 +108,11 @@
 			"./app/middleware/*.ts"
 		]
 	},
-  "eslintConfig": {
-    "extends": "@adonisjs/eslint-config/app"
-  },
 	"prettier": {
 		"trailingComma": "es5",
 		"semi": true,
 		"singleQuote": true,
-    "useTabs": false,
+		"useTabs": true,
 		"quoteProps": "as-needed",
 		"bracketSpacing": true,
 		"arrowParens": "always",

start/kernel.ts

@@ -41,6 +41,8 @@ router.use([
 	() => import('@adonisjs/session/session_middleware'),
 	() => import('@adonisjs/shield/shield_middleware'),
 	() => import('@adonisjs/auth/initialize_auth_middleware'),
+	() => import('#middleware/silent_auth_middleware'),
+	() => import('#middleware/update_user_last_seen_middleware'),
 ]);
 
 /**