From d5c90a742bff68a519637bc1e37f5181a77ff5c2 Mon Sep 17 00:00:00 2001
From: WillyJL <49810075+Willy-JL@users.noreply.github.com>
Date: Sun, 3 Sep 2023 17:54:12 +0200
Subject: [PATCH] Fix enable/disable edit mode (#1333)
---
.../Dashboard/Modals/AboutModal/AboutModal.tsx | 2 +-
src/components/layout/header/Header.tsx | 2 +-
src/components/layout/header/SettingsMenu.tsx | 2 +-
.../layout/header/SettingsMenu/EditModeToggle.tsx | 4 ++--
src/hooks/useEditModeInformation.ts | 4 ++--
src/modules/Docker/ContainerActionBar.tsx | 2 +-
src/pages/_app.tsx | 9 ++++-----
src/pages/api/configs/[slug].ts | 2 +-
src/pages/api/configs/tryPassword.tsx | 2 +-
src/server/api/routers/config.ts | 6 ++++++
src/server/api/routers/notebook.ts | 2 +-
11 files changed, 21 insertions(+), 16 deletions(-)
diff --git a/src/components/Dashboard/Modals/AboutModal/AboutModal.tsx b/src/components/Dashboard/Modals/AboutModal/AboutModal.tsx
index 19b2252d6..cf499d401 100644
--- a/src/components/Dashboard/Modals/AboutModal/AboutModal.tsx
+++ b/src/components/Dashboard/Modals/AboutModal/AboutModal.tsx
@@ -210,7 +210,7 @@ const useInformationTableItems = (newVersionAvailable?: string): InformationTabl
let items: InformationTableItem[] = [];
- if (editModeEnabled) {
+ if (!editModeEnabled) {
items = [
...items,
{
diff --git a/src/components/layout/header/Header.tsx b/src/components/layout/header/Header.tsx
index fc464ea0f..935f6841f 100644
--- a/src/components/layout/header/Header.tsx
+++ b/src/components/layout/header/Header.tsx
@@ -42,7 +42,7 @@ export function Header(props: any) {
noWrap
>
- {!editModeEnabled && }
+ {editModeEnabled && }
- {!editModeEnabled && (
+ {editModeEnabled && (
} onClick={drawer.open}>
{t('sections.settings')}
diff --git a/src/components/layout/header/SettingsMenu/EditModeToggle.tsx b/src/components/layout/header/SettingsMenu/EditModeToggle.tsx
index 4615edefb..ae44fa48a 100644
--- a/src/components/layout/header/SettingsMenu/EditModeToggle.tsx
+++ b/src/components/layout/header/SettingsMenu/EditModeToggle.tsx
@@ -61,7 +61,7 @@ function ModalContent() {
export function EditModeToggle() {
const { editModeEnabled } = useEditModeInformationStore();
- const Icon = editModeEnabled ? IconEdit : IconEditOff;
+ const Icon = editModeEnabled ? IconEditOff : IconEdit;
const { t } = useTranslation('settings/general/edit-mode-toggle');
return (
@@ -77,7 +77,7 @@ export function EditModeToggle() {
})
}
>
- {editModeEnabled ? t('menu.enable') : t('menu.disable')}
+ {editModeEnabled ? t('menu.disable') : t('menu.enable')}
);
}
diff --git a/src/hooks/useEditModeInformation.ts b/src/hooks/useEditModeInformation.ts
index c59edc86c..9d4af5aca 100644
--- a/src/hooks/useEditModeInformation.ts
+++ b/src/hooks/useEditModeInformation.ts
@@ -2,10 +2,10 @@ import { create } from 'zustand';
interface EditModeInformationStore {
editModeEnabled: boolean;
- setDisabled: () => void;
+ setEnabled: () => void;
}
export const useEditModeInformationStore = create((set) => ({
editModeEnabled: false,
- setDisabled: () => set(() => ({ editModeEnabled: true })),
+ setEnabled: () => set(() => ({ editModeEnabled: true })),
}));
diff --git a/src/modules/Docker/ContainerActionBar.tsx b/src/modules/Docker/ContainerActionBar.tsx
index e5046cbf8..4d4f82f4b 100644
--- a/src/modules/Docker/ContainerActionBar.tsx
+++ b/src/modules/Docker/ContainerActionBar.tsx
@@ -36,7 +36,7 @@ export default function ContainerActionBar({ selected, reload }: ContainerAction
const getLowestWrapper = () =>
config.wrappers.sort((wrapper1, wrapper2) => wrapper1.position - wrapper2.position)[0];
- if (process.env.DISABLE_EDIT_MODE === 'true') {
+ if (process.env.DISABLE_EDIT_MODE?.toLowerCase() === 'true') {
return null;
}
diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx
index c62bbbee4..3ba99b43e 100644
--- a/src/pages/_app.tsx
+++ b/src/pages/_app.tsx
@@ -90,13 +90,13 @@ function App(
});
const { setInitialPackageAttributes } = usePackageAttributesStore();
- const { setDisabled } = useEditModeInformationStore();
+ const { setEnabled } = useEditModeInformationStore();
useEffect(() => {
setInitialPackageAttributes(props.pageProps.packageAttributes);
- if (!props.pageProps.editModeEnabled) {
- setDisabled();
+ if (props.pageProps.editModeEnabled) {
+ setEnabled();
}
}, []);
@@ -165,8 +165,7 @@ function App(
}
App.getInitialProps = ({ ctx }: { ctx: GetServerSidePropsContext }) => {
- const disableEditMode =
- process.env.DISABLE_EDIT_MODE && process.env.DISABLE_EDIT_MODE.toLowerCase() === 'true';
+ const disableEditMode = process.env.DISABLE_EDIT_MODE?.toLowerCase() === 'true';
if (disableEditMode) {
Consola.warn(
'EXPERIMENTAL: You have disabled the edit mode. Modifications are no longer possible and any requests on the API will be dropped. If you want to disable this, unset the DISABLE_EDIT_MODE environment variable. This behaviour may be removed in future versions of Homarr'
diff --git a/src/pages/api/configs/[slug].ts b/src/pages/api/configs/[slug].ts
index 243c43183..0fc639593 100644
--- a/src/pages/api/configs/[slug].ts
+++ b/src/pages/api/configs/[slug].ts
@@ -8,7 +8,7 @@ import { BackendConfigType, ConfigType } from '../../../types/config';
import { IRssWidget } from '../../../widgets/rss/RssWidgetTile';
function Put(req: NextApiRequest, res: NextApiResponse) {
- if (process.env.DISABLE_EDIT_MODE === 'true') {
+ if (process.env.DISABLE_EDIT_MODE?.toLowerCase() === 'true') {
return res.status(409).json({ error: 'Edit mode has been disabled by the administrator' });
}
diff --git a/src/pages/api/configs/tryPassword.tsx b/src/pages/api/configs/tryPassword.tsx
index 6e6b98670..d151f36a6 100644
--- a/src/pages/api/configs/tryPassword.tsx
+++ b/src/pages/api/configs/tryPassword.tsx
@@ -5,7 +5,7 @@ function Post(req: NextApiRequest, res: NextApiResponse) {
const { tried, type = 'password' } = req.body;
// If the type of password is "edit", we run this branch to check the edit password
if (type === 'edit') {
- if ((tried === process.env.EDIT_MODE_PASSWORD) !== undefined) {
+ if (tried === process.env.EDIT_MODE_PASSWORD) {
if (process.env.DISABLE_EDIT_MODE?.toLowerCase() === 'true') {
process.env.DISABLE_EDIT_MODE = 'false';
} else {
diff --git a/src/server/api/routers/config.ts b/src/server/api/routers/config.ts
index f2d9ee94a..784fd9a5a 100644
--- a/src/server/api/routers/config.ts
+++ b/src/server/api/routers/config.ts
@@ -68,6 +68,12 @@ export const configRouter = createTRPCRouter({
})
)
.mutation(async ({ input }) => {
+ if (process.env.DISABLE_EDIT_MODE?.toLowerCase() === 'true') {
+ throw new TRPCError({
+ code: 'METHOD_NOT_SUPPORTED',
+ message: 'Edit is not allowed, because edit mode is disabled'
+ });
+ }
Consola.info(`Saving updated configuration of '${input.name}' config.`);
const previousConfig = getConfig(input.name);
diff --git a/src/server/api/routers/notebook.ts b/src/server/api/routers/notebook.ts
index 057c64031..1209e6986 100644
--- a/src/server/api/routers/notebook.ts
+++ b/src/server/api/routers/notebook.ts
@@ -13,7 +13,7 @@ export const notebookRouter = createTRPCRouter({
.input(z.object({ widgetId: z.string(), content: z.string(), configName: z.string() }))
.mutation(async ({ input }) => {
//TODO: #1305 Remove use of DISABLE_EDIT_MODE for auth update
- if (!process.env.DISABLE_EDIT_MODE) {
+ if (process.env.DISABLE_EDIT_MODE?.toLowerCase() === 'true') {
throw new TRPCError({
code: 'METHOD_NOT_SUPPORTED',
message: 'Edit is not allowed, because edit mode is disabled'