Merge pull request #33 from nordeck/nic/feat/ZO-178

feat: room name entering and saving added

Author: Wagner O. Wutzke

package-lock.json

@@ -30,6 +30,7 @@
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
     "react-i18next": "^15.4.0",
+    "string-strip-html": "^13.4.8",
     "uuid": "^11.0.5"
   },
   "devDependencies": {

package.json

@@ -0,0 +1,32 @@
+/*
+ * Copyright 2025 Nordeck IT + Consulting GmbH
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { fetchWithAuth } from '@/utils/api/fetchWithAuth';
+import { NextRequest } from 'next/server';
+
+export async function PUT(
+    request: NextRequest,
+    props: { params: Promise<{ meetingId: string }> },
+) {
+    const params = await props.params;
+    return fetchWithAuth({
+        relativeUrl: `api/v1.0/meetings/${params.meetingId}`,
+        requestInit: {
+            body: JSON.stringify(await request.json()),
+            method: 'PUT',
+        },
+    });
+}

src/app/api/meetings/[meetingId]/route.ts

@@ -16,17 +16,28 @@
 
 'use client'
 
-import { useEffect } from 'react'
-import StartConferenceButton from "@/components/conference/StartConferenceButton";
-import CopyConferenceInfoButton from "@/components/conference/CopyConferenceInfoButton";
+import {createContext, useEffect, useState} from 'react'
 import {useGetOrCreateInstantMeeting} from "@/components/conference/useGetOrCreateInstantMeeting";
-import VideoTestButton from "@/components/conference/VideoTestButton";
 import {useSnackbar} from "@/contexts/Snackbar/SnackbarContext";
 import {useAuth} from "@/contexts/Auth/AuthProvider";
 import {isVarTrue} from "@/lib/isVarTrue";
-import {Stack} from "@mui/material";
+import {Card, Stack} from "@mui/material";
+import ConferenceNameField from "@/components/conference/ConferenceNameField";
+import StartConferenceButton from "@/components/conference/StartConferenceButton";
+import CopyConferenceInfoButton from "@/components/conference/CopyConferenceInfoButton";
+import VideoTestButton from "@/components/conference/VideoTestButton";
+import {Meeting} from "@/types/types";
 import "../../../i18n"
 
+export type MeetingContext = {
+    meeting: Meeting | undefined,
+    nameHasChanged: boolean,
+    setNameHasChanged: (val: boolean) => void,
+}
+
+
+export const ConferenceContext = createContext<MeetingContext | null>(null);
+
 function ConferenceActions() {
 
     const {
@@ -35,10 +46,13 @@ function ConferenceActions() {
         },
     } = useAuth();
 
+
     const isVideoTestEnabled = isVarTrue(NEXT_PUBLIC_VIDEO_TEST_ENABLED);
 
     const { meeting, isLoading, error, getOrCreateMeeting } = useGetOrCreateInstantMeeting();
 
+    const [ nameHasChanged, setNameHasChanged ] = useState(false);
+
     const { showSnackbar } = useSnackbar();
 
     useEffect(() => {
@@ -56,20 +70,26 @@ function ConferenceActions() {
 
     return (
         <>
-            <Stack className="space-y-6 w-full items-center justify-center">
-                <Stack className="w-1/4">
-                    <StartConferenceButton meeting={meeting} />
-                </Stack>
-                <Stack className={""}></Stack>
-                <Stack className="w-1/6">
-                    <CopyConferenceInfoButton meeting={meeting} />
-                </Stack>
-                { isVideoTestEnabled &&
-                    <Stack className="w-1/6">
-                        <VideoTestButton />
+            <ConferenceContext.Provider value={{ meeting, nameHasChanged, setNameHasChanged }}>
+                <Card variant="outlined" className={'w-2/3 p-4'}>
+                    <Stack className="space-y-6 w-full items-center justify-center">
+                        <Stack className="w-1/3">
+                            <ConferenceNameField />
+                        </Stack>
+                        <Stack className="w-1/3">
+                            <StartConferenceButton />
+                        </Stack>
+                        <Stack className="w-1/4">
+                            <CopyConferenceInfoButton meeting={meeting} />
+                        </Stack>
+                        { isVideoTestEnabled &&
+                            <Stack className="w-1/4">
+                                <VideoTestButton />
+                            </Stack>
+                        }
                     </Stack>
-                }
-            </Stack>
+                </Card>
+            </ConferenceContext.Provider>
         </>
     )
 }