diff --git a/.github/renovate.json5 b/.github/renovate.json5
index a76fd60c1..e7e82ba4b 100644
--- a/.github/renovate.json5
+++ b/.github/renovate.json5
@@ -6,9 +6,9 @@
matchPackagePatterns: ["^@homarr/"],
enabled: false,
},
- // Disable Dockerode updates see https://github.com/apocas/dockerode/issues/787
+ // 15.2.0 crashes with turbopack error (panic)
{
- matchPackagePatterns: ["^dockerode$"],
+ matchPackagePatterns: ["^next$", "^@next/eslint-plugin-next$"],
enabled: false,
},
{
diff --git a/.github/workflows/deployment-docker-image.yml b/.github/workflows/deployment-docker-image.yml
index fb2fa4fcd..f70798295 100644
--- a/.github/workflows/deployment-docker-image.yml
+++ b/.github/workflows/deployment-docker-image.yml
@@ -15,13 +15,14 @@ on:
description: Send notifications
permissions:
- contents: write
- packages: write
+ contents: write # Required to update package.json version
+ packages: write # Required for pushing to GHCR
env:
SKIP_ENV_VALIDATION: true
REGISTRY: ghcr.io
IMAGE_NAME: ${{ github.repository }}
+ GHCR_REPO: ghcr.io/${{ github.repository }}
TURBO_TELEMETRY_DISABLED: 1
concurrency:
@@ -102,59 +103,123 @@ jobs:
git pull origin dev
git rebase ${{ github.ref_name }}
git push origin dev
- deploy:
- name: Deploy docker image
+ build-amd64:
+ name: Build docker image for amd64
needs: release
runs-on: ubuntu-latest
- env:
- NEXT_VERSION: ${{ needs.release.outputs.version }}
- DEPLOY_LATEST: ${{ github.ref_name == 'main' }}
- DEPLOY_BETA: ${{ github.ref_name == 'beta' }}
+ outputs:
+ digest: ${{ steps.build.outputs.digest }}
steps:
- uses: actions/checkout@v4
with:
ref: ${{ needs.release.outputs.git_ref }}
- - name: Discord notification
- if: ${{ github.events.inputs.send-notifications != false }}
- env:
- DISCORD_WEBHOOK: ${{ secrets.DISCORD_WEBHOOK }}
- uses: Ilshidur/action-discord@master
+
+ - name: Docker meta
+ id: meta
+ uses: docker/metadata-action@v5
with:
- args: "Deployment of an image for version '${{env.NEXT_VERSION}}' has been triggered: [run ${{ github.run_number }}](<${{ github.server_url }}/${{ github.repository }}/actions/runs/${{ github.run_id }}>)"
+ images: "${{ env.GHCR_REPO }}"
+
- name: Log in to the Container registry
uses: docker/login-action@v3
with:
registry: ${{ env.REGISTRY }}
username: ${{ github.actor }}
password: ${{ secrets.GITHUB_TOKEN }}
- - name: Set up QEMU
- uses: docker/setup-qemu-action@v3
+
- name: Set up Docker Buildx
uses: docker/setup-buildx-action@v3
+
+ - name: Build and push by digest
+ id: build
+ uses: docker/build-push-action@v6
+ with:
+ context: .
+ network: host
+ platforms: linux/amd64
+ labels: ${{ steps.meta.outputs.labels }}
+ outputs: type=image,"name=${{ env.GHCR_REPO }}",push-by-digest=true,name-canonical=true,push=true
+ env:
+ SKIP_ENV_VALIDATION: true
+
+ build-arm64:
+ name: Build docker image for arm64
+ needs: release
+ runs-on: ubuntu-24.04-arm
+ outputs:
+ digest: ${{ steps.build.outputs.digest }}
+ steps:
+ - uses: actions/checkout@v4
+ with:
+ ref: ${{ needs.release.outputs.git_ref }}
+
- name: Docker meta
id: meta
uses: docker/metadata-action@v5
with:
- images: "${{ env.REGISTRY }}/${{ env.IMAGE_NAME }}"
- tags: |
- ${{ env.DEPLOY_LATEST == 'true' && 'type=raw,value=latest' || null }}
- ${{ env.DEPLOY_BETA == 'true' && 'type=raw,value=beta' || null }}
- type=raw,value=${{ env.NEXT_VERSION }}
- - name: Build and push
- id: buildPushAction
+ images: "${{ env.GHCR_REPO }}"
+
+ - name: Log in to the Container registry
+ uses: docker/login-action@v3
+ with:
+ registry: ${{ env.REGISTRY }}
+ username: ${{ github.actor }}
+ password: ${{ secrets.GITHUB_TOKEN }}
+
+ - name: Set up Docker Buildx
+ uses: docker/setup-buildx-action@v3
+
+ - name: Build and push by digest
+ id: build
uses: docker/build-push-action@v6
with:
- platforms: linux/amd64,linux/arm64
context: .
- push: true
- tags: ${{ steps.meta.outputs.tags }}
- labels: ${{ steps.meta.outputs.labels }}
network: host
+ platforms: linux/arm64
+ labels: ${{ steps.meta.outputs.labels }}
+ outputs: type=image,"name=${{ env.GHCR_REPO }}",push-by-digest=true,name-canonical=true,push=true
env:
SKIP_ENV_VALIDATION: true
+
+ publish:
+ name: Complete deployment and notify
+ needs: [release, build-amd64, build-arm64]
+ runs-on: ubuntu-latest
+ env:
+ NEXT_VERSION: ${{ needs.release.outputs.version }}
+ DEPLOY_LATEST: ${{ github.ref_name == 'main' }}
+ DEPLOY_BETA: ${{ github.ref_name == 'beta' }}
+ steps:
+ - name: Log in to the Container registry
+ uses: docker/login-action@v3
+ with:
+ registry: ${{ env.REGISTRY }}
+ username: ${{ github.actor }}
+ password: ${{ secrets.GITHUB_TOKEN }}
+
+ - name: Publish beta
+ if: env.DEPLOY_BETA == 'true'
+ run: |
+ docker buildx imagetools create -t ${{ env.GHCR_REPO }}:beta \
+ ${{ env.GHCR_REPO }}@${{ needs.build-amd64.outputs.digest }} \
+ ${{ env.GHCR_REPO }}@${{ needs.build-arm64.outputs.digest }}
+
+ - name: Publish latest
+ if: env.DEPLOY_LATEST == 'true'
+ run: |
+ docker buildx imagetools create -t ${{ env.GHCR_REPO }}:latest \
+ ${{ env.GHCR_REPO }}@${{ needs.build-amd64.outputs.digest }} \
+ ${{ env.GHCR_REPO }}@${{ needs.build-arm64.outputs.digest }}
+
+ - name: Publish version
+ run: |
+ docker buildx imagetools create -t ${{ env.GHCR_REPO }}:${{ env.NEXT_VERSION }} \
+ ${{ env.GHCR_REPO }}@${{ needs.build-amd64.outputs.digest }} \
+ ${{ env.GHCR_REPO }}@${{ needs.build-arm64.outputs.digest }}
+
- name: Discord notification
env:
DISCORD_WEBHOOK: ${{ secrets.DISCORD_WEBHOOK }}
uses: Ilshidur/action-discord@master
with:
- args: "Deployment of image has completed for branch ${{ github.ref_name }}. Image ID is '${{ steps.buildPushAction.outputs.imageid }}'."
+ args: "Successfully deployed images for branch **${{ github.ref_name }}**. Tagged as **${{env.NEXT_VERSION}}**."
diff --git a/.run/typecheck.run.xml b/.run/typecheck.run.xml
new file mode 100644
index 000000000..c3c228ae5
--- /dev/null
+++ b/.run/typecheck.run.xml
@@ -0,0 +1,13 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/apps/nextjs/package.json b/apps/nextjs/package.json
index 030404136..cb8d4ae49 100644
--- a/apps/nextjs/package.json
+++ b/apps/nextjs/package.json
@@ -56,9 +56,9 @@
"@mantine/tiptap": "^7.17.0",
"@million/lint": "1.0.14",
"@tabler/icons-react": "^3.30.0",
- "@tanstack/react-query": "^5.66.9",
- "@tanstack/react-query-devtools": "^5.66.9",
- "@tanstack/react-query-next-experimental": "^5.66.9",
+ "@tanstack/react-query": "^5.66.11",
+ "@tanstack/react-query-devtools": "^5.66.11",
+ "@tanstack/react-query-next-experimental": "^5.66.11",
"@trpc/client": "next",
"@trpc/next": "next",
"@trpc/react-query": "next",
@@ -81,9 +81,9 @@
"react-dom": "19.0.0",
"react-error-boundary": "^5.0.0",
"react-simple-code-editor": "^0.14.1",
- "sass": "^1.85.0",
+ "sass": "^1.85.1",
"superjson": "2.2.2",
- "swagger-ui-react": "^5.19.0",
+ "swagger-ui-react": "^5.20.0",
"use-deep-compare-effect": "^1.8.1",
"zod": "^3.24.2"
},
@@ -92,15 +92,15 @@
"@homarr/prettier-config": "workspace:^0.1.0",
"@homarr/tsconfig": "workspace:^0.1.0",
"@types/chroma-js": "3.1.1",
- "@types/node": "^22.13.4",
+ "@types/node": "^22.13.5",
"@types/prismjs": "^1.26.5",
"@types/react": "19.0.10",
"@types/react-dom": "19.0.4",
"@types/swagger-ui-react": "^5.18.0",
"concurrently": "^9.1.2",
- "eslint": "^9.20.1",
+ "eslint": "^9.21.0",
"node-loader": "^2.1.0",
- "prettier": "^3.5.1",
- "typescript": "^5.7.3"
+ "prettier": "^3.5.2",
+ "typescript": "^5.8.2"
}
}
diff --git a/apps/nextjs/src/app/[locale]/boards/(content)/_client.tsx b/apps/nextjs/src/app/[locale]/boards/(content)/_client.tsx
index 0f3454653..e9551af52 100644
--- a/apps/nextjs/src/app/[locale]/boards/(content)/_client.tsx
+++ b/apps/nextjs/src/app/[locale]/boards/(content)/_client.tsx
@@ -5,7 +5,7 @@ import { Box, LoadingOverlay, Stack } from "@mantine/core";
import type { RouterOutputs } from "@homarr/api";
import { clientApi } from "@homarr/api/client";
-import { useRequiredBoard } from "@homarr/boards/context";
+import { useCurrentLayout, useRequiredBoard } from "@homarr/boards/context";
import { BoardCategorySection } from "~/components/board/sections/category-section";
import { BoardEmptySection } from "~/components/board/sections/empty-section";
@@ -43,6 +43,7 @@ export const useUpdateBoard = () => {
export const ClientBoard = () => {
const board = useRequiredBoard();
+ const currentLayoutId = useCurrentLayout();
const isReady = useIsBoardReady();
const fullWidthSortedSections = board.sections
@@ -63,9 +64,10 @@ export const ClientBoard = () => {
{fullWidthSortedSections.map((section) =>
section.kind === "empty" ? (
-
+ // Unique keys per layout to always reinitialize the gridstack
+
) : (
-
+
),
)}
diff --git a/apps/nextjs/src/app/[locale]/boards/(content)/_creator.tsx b/apps/nextjs/src/app/[locale]/boards/(content)/_creator.tsx
index c5caa21cf..49be8c37c 100644
--- a/apps/nextjs/src/app/[locale]/boards/(content)/_creator.tsx
+++ b/apps/nextjs/src/app/[locale]/boards/(content)/_creator.tsx
@@ -13,7 +13,7 @@ import { getI18n } from "@homarr/translation/server";
import { createMetaTitle } from "~/metadata";
import { createBoardLayout } from "../_layout-creator";
import type { Board } from "../_types";
-import { ClientBoard } from "./_client";
+import { DynamicClientBoard } from "./_dynamic-client";
import { BoardContentHeaderActions } from "./_header-actions";
export type Params = Record;
@@ -37,13 +37,13 @@ export const createBoardContentPage = >(
return (
-
+
);
},
- generateMetadataAsync: async ({ params }: { params: TParams }): Promise => {
+ generateMetadataAsync: async ({ params }: { params: Promise }): Promise => {
try {
- const board = await getInitialBoard(params);
+ const board = await getInitialBoard(await params);
const t = await getI18n();
return {
diff --git a/apps/nextjs/src/app/[locale]/boards/(content)/_dynamic-client.tsx b/apps/nextjs/src/app/[locale]/boards/(content)/_dynamic-client.tsx
new file mode 100644
index 000000000..50b0aff66
--- /dev/null
+++ b/apps/nextjs/src/app/[locale]/boards/(content)/_dynamic-client.tsx
@@ -0,0 +1,7 @@
+"use client";
+
+import dynamic from "next/dynamic";
+
+export const DynamicClientBoard = dynamic(() => import("./_client").then((mod) => mod.ClientBoard), {
+ ssr: false,
+});
diff --git a/apps/nextjs/src/app/[locale]/boards/(content)/_header-actions.tsx b/apps/nextjs/src/app/[locale]/boards/(content)/_header-actions.tsx
index 6b3153b46..45436b476 100644
--- a/apps/nextjs/src/app/[locale]/boards/(content)/_header-actions.tsx
+++ b/apps/nextjs/src/app/[locale]/boards/(content)/_header-actions.tsx
@@ -4,7 +4,7 @@ import type { MouseEvent } from "react";
import { useCallback, useEffect } from "react";
import Link from "next/link";
import { useRouter } from "next/navigation";
-import { Group, Menu } from "@mantine/core";
+import { Group, Menu, ScrollArea } from "@mantine/core";
import { useHotkeys } from "@mantine/hooks";
import {
IconBox,
@@ -168,16 +168,18 @@ const SelectBoardsMenu = () => {
- {boards.map((board) => (
- }
- >
- {board.name}
-
- ))}
+
+ {boards.map((board) => (
+ }
+ >
+ {board.name}
+
+ ))}
+
);
diff --git a/apps/nextjs/src/app/[locale]/boards/[name]/settings/_layout.tsx b/apps/nextjs/src/app/[locale]/boards/[name]/settings/_layout.tsx
index f0c2eeb9f..99c0a7f41 100644
--- a/apps/nextjs/src/app/[locale]/boards/[name]/settings/_layout.tsx
+++ b/apps/nextjs/src/app/[locale]/boards/[name]/settings/_layout.tsx
@@ -1,43 +1,109 @@
"use client";
-import { Button, Grid, Group, Input, Slider, Stack } from "@mantine/core";
+import { Button, Fieldset, Grid, Group, Input, NumberInput, Slider, Stack, Text, TextInput } from "@mantine/core";
+import { clientApi } from "@homarr/api/client";
+import { createId } from "@homarr/db/client";
import { useZodForm } from "@homarr/form";
import { useI18n } from "@homarr/translation/client";
import { validation } from "@homarr/validation";
import type { Board } from "../../_types";
-import { useSavePartialSettingsMutation } from "./_shared";
interface Props {
board: Board;
}
export const LayoutSettingsContent = ({ board }: Props) => {
const t = useI18n();
- const { mutate: savePartialSettings, isPending } = useSavePartialSettingsMutation(board);
- const form = useZodForm(validation.board.savePartialSettings.pick({ columnCount: true }).required(), {
+ const utils = clientApi.useUtils();
+ const { mutate: saveLayouts, isPending } = clientApi.board.saveLayouts.useMutation({
+ onSettled() {
+ void utils.board.getBoardByName.invalidate({ name: board.name });
+ void utils.board.getHomeBoard.invalidate();
+ },
+ });
+ const form = useZodForm(validation.board.saveLayouts.omit({ id: true }).required(), {
initialValues: {
- columnCount: board.columnCount,
+ layouts: board.layouts,
},
});
return (