diff --git a/src/components/ModalComponent.tsx b/src/components/ModalComponent.tsx
index e1fe160312..03e09af355 100644
--- a/src/components/ModalComponent.tsx
+++ b/src/components/ModalComponent.tsx
@@ -44,6 +44,7 @@ interface Props {
   loading: boolean
   setModalLoading: (value: boolean) => void
   showUserProjectList: () => void
+  accessToken: string
 }
 
 interface UpdateProject {
@@ -57,12 +58,13 @@ const ModalComponent = (props: Props) => {
   const toast = useToast()
   const [loadingAdd, setLoadingAdd] = useState(false)
 
-  const updateProject = async (e: UpdateProject) => {
+  const updateProject = async (e: UpdateProject, token: string) => {
     props.setModalLoading(true)
     let bodyData = {
       project: {
         id: e.id,
         public: e.public,
+        accessToken: token,
       },
     }
     const response = await fetch('/api/project/update', {
@@ -111,7 +113,7 @@ const ModalComponent = (props: Props) => {
     }
   }
 
-  const publishPublicProject = async (e: UpdateProject) => {
+  const publishPublicProject = async (e: UpdateProject, token: string) => {
     props.setModalLoading(true)
 
     e.public = !e.public
@@ -119,16 +121,18 @@ const ModalComponent = (props: Props) => {
       id: e.id,
       public: e.public,
       projectName: e.projectName,
+      accessToken: token,
     }
 
-    const projectUpdated = await updateProject(data)
+    const projectUpdated = await updateProject(data, token)
 
     props.setModalLoading(false)
 
     if (projectUpdated) {
       toast({
         title: 'The project visibility has been updated',
-        description: 'The project has been updated successfully',
+        description:
+          'The project must now be validated by an admin to publish it in the gallery',
         status: 'success',
         duration: 9000,
         isClosable: true,
@@ -311,23 +315,30 @@ const ModalComponent = (props: Props) => {
                             <AccordionIcon />
                           </AccordionHeader>
                           <AccordionPanel pb={4}>
-                            <Switch
-                              color="teal"
-                              id="projectPublic"
-                              size="md"
-                              defaultIsChecked={e.public}
-                              onChange={() => publishPublicProject(e)}
-                            />
-                            {e.public && (
-                              <Button
-                                variantColor="teal"
-                                size="sm"
-                                ml={5}
-                                onClick={() => saveScreenshot(e)}
-                              >
-                                Take a screenshot
-                              </Button>
-                            )}
+                            <Flex align="center" justify="center">
+                              <Text mr={3}>
+                                {e.public ? 'Public' : 'Private'}
+                              </Text>
+                              <Switch
+                                color="teal"
+                                id="projectPublic"
+                                size="md"
+                                defaultIsChecked={e.public}
+                                onChange={() =>
+                                  publishPublicProject(e, props.accessToken)
+                                }
+                              />
+                              {e.public && (
+                                <Button
+                                  variantColor="teal"
+                                  size="sm"
+                                  ml={5}
+                                  onClick={() => saveScreenshot(e)}
+                                >
+                                  Take a screenshot
+                                </Button>
+                              )}
+                            </Flex>
                           </AccordionPanel>
                         </AccordionItem>
                       </Accordion>
diff --git a/src/pages/api/project/update.ts b/src/pages/api/project/update.ts
index d438f8757c..0377429527 100644
--- a/src/pages/api/project/update.ts
+++ b/src/pages/api/project/update.ts
@@ -8,20 +8,38 @@ export default async function UpdateProject(
   let ts = new Date()
   try {
     const { project: projectData } = req.body
-    await prisma.project.update({
+
+    const projects = await prisma.session.findUnique({
       where: {
-        id: projectData.id,
-      },
-      data: {
-        markup: projectData.markup,
-        public: projectData.public,
-        updatedAt: ts.toISOString(),
+        accessToken: projectData.accessToken,
       },
     })
-    res.status(201)
-    res.json({
-      success: 'Update project to database successfully !',
+
+    const userProject = await prisma.project.findUnique({
+      where: {
+        id: projectData.id,
+      },
     })
+
+    if (userProject?.userId === projects?.userId) {
+      await prisma.project.update({
+        where: {
+          id: projectData.id,
+        },
+        data: {
+          markup: projectData.markup,
+          public: projectData.public,
+          updatedAt: ts.toISOString(),
+        },
+      })
+      res.status(201)
+      res.json({
+        success: 'Update project to database successfully !',
+      })
+    } else {
+      res.status(500)
+      res.json({ error: 'Sorry this is not your project' })
+    }
   } catch (e) {
     res.status(500)
     res.json({ error: 'Sorry unable to update project to database' })
diff --git a/src/pages/editor.tsx b/src/pages/editor.tsx
index 43ff231516..1418307315 100644
--- a/src/pages/editor.tsx
+++ b/src/pages/editor.tsx
@@ -58,6 +58,7 @@ const EditorPage = (props: {
         id: props.id,
         projectName: props.projectName,
         validated: props.validated,
+        accessToken: session?.accessToken as string,
       },
     }
     const response = await fetch('/api/project/update', {
@@ -241,6 +242,7 @@ const EditorPage = (props: {
                   loading={modalLoading}
                   setModalLoading={setModalLoading}
                   showUserProjectList={showUserProjectList}
+                  accessToken={session?.accessToken as string}
                 />
 
                 <Box
@@ -299,6 +301,7 @@ const EditorPage = (props: {
                 loading={modalLoading}
                 setModalLoading={setModalLoading}
                 showUserProjectList={showUserProjectList}
+                accessToken={session?.accessToken as string}
               />
               <Box
                 maxH="calc(100vh - 3rem)"