diff --git a/web/src/Sidebar.jsx b/web/src/Sidebar.jsx
index 15092500f..1e6c4d28b 100644
--- a/web/src/Sidebar.jsx
+++ b/web/src/Sidebar.jsx
@@ -21,7 +21,7 @@ export default function Sidebar() {
             <Fragment>
               <Separator />
               {cameras.filter(([cam, conf]) => conf.gui.show).sort(([aCam, aConf], [bCam, bConf]) => aConf.gui.order === bConf.gui.order ? 0 : (aConf.gui.order > bConf.gui.order ? 1 : -1)).map(([camera]) => (
-                <Destination href={`/cameras/${camera}`} text={camera} />
+                <Destination key={camera} href={`/cameras/${camera}`} text={camera} />
               ))}
               <Separator />
             </Fragment>
@@ -37,6 +37,7 @@ export default function Sidebar() {
                 if (conf.record.enabled) {
                   return (
                     <Destination
+                      key={camera}
                       path={`/recording/${camera}/:date?/:hour?/:seconds?`}
                       href={`/recording/${camera}`}
                       text={camera}
diff --git a/web/src/routes/Cameras.jsx b/web/src/routes/Cameras.jsx
index 1cf593a8e..1b7063be5 100644
--- a/web/src/routes/Cameras.jsx
+++ b/web/src/routes/Cameras.jsx
@@ -17,7 +17,7 @@ export default function Cameras() {
   ) : (
     <div className="grid grid-cols-1 3xl:grid-cols-3 md:grid-cols-2 gap-4">
       {Object.entries(config.cameras).filter(([cam, conf]) => conf.gui.show).sort(([aCam, aConf], [bCam, bConf]) => aConf.gui.order === bConf.gui.order ? 0 : (aConf.gui.order > bConf.gui.order ? 1 : -1)).map(([camera, conf]) => (
-        <Camera name={camera} conf={conf} />
+        <Camera key={camera} name={camera} conf={conf} />
       ))}
     </div>
   );