diff --git a/src/pages/pnspsUserDetailPage_Public/UserInformationCard_Public.js b/src/pages/pnspsUserDetailPage_Public/UserInformationCard_Public.js
new file mode 100644
index 0000000..07af1ed
--- /dev/null
+++ b/src/pages/pnspsUserDetailPage_Public/UserInformationCard_Public.js
@@ -0,0 +1,252 @@
+// material-ui
+import {
+    Grid, TextField, Typography
+} from '@mui/material';
+import MainCard from "../../components/MainCard";
+import * as React from "react";
+import {useForm} from "react-hook-form";
+import {useEffect, useState} from "react";
+import Checkbox from "@mui/material/Checkbox";
+import LoadingComponent from "../extra-pages/LoadingComponent";
+//import {useParams} from "react-router-dom";
+
+// ==============================|| DASHBOARD - DEFAULT ||============================== //
+
+
+const UserInformationCard_Public = ({isCollectData, updateUserObject,userData}) => {
+
+    const readOnly = true;
+
+    //const params = useParams();
+    const [currentUserData, setCurrentUserData] = React.useState({});
+    const [locked, setLocked] = useState(false);
+    const [onReady, setOnReady] = useState(false);
+    const {register, getValues} = useForm()
+
+    useEffect(() => {
+        //if user data from parent are not null
+        if (Object.keys(userData).length > 0 && userData !== undefined) {
+            setCurrentUserData(userData.data);
+        }
+    }, [userData]);
+
+    useEffect(() => {
+        //if state data are ready and assign to different field
+        if (Object.keys(userData).length > 0 &&currentUserData !== undefined) {
+            setLocked(currentUserData.locked);
+            setOnReady(true);
+        }
+    }, [currentUserData]);
+
+    useEffect(() => {
+        //upload latest data to parent
+        const values = getValues();
+        const objectData ={
+            ...values,
+            locked: locked,
+        }
+        updateUserObject(objectData);
+    }, [isCollectData]);
+
+    return (
+        !onReady ?
+            <LoadingComponent/>
+            :
+            <MainCard elevation={0}
+                      border={false}
+                      content={false}
+            >
+                <Typography variant="h5" sx={{mt: 3, ml: 3, mb: 1}}>
+                    Information
+                </Typography>
+
+
+                <form>
+                    <Grid container>
+                        <Grid item xs={12} s={12} md={12} lg={12} sx={{ml: 3, mr: 3, mb: 3}}>
+                            <Grid container alignItems={"center"}>
+                                <Grid item xs={4} s={4} md={4} lg={4}
+                                      sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}>
+                                    Username:
+                                </Grid>
+
+                                <Grid item xs={7} s={7} md={7} lg={6}>
+                                    <TextField
+                                        fullWidth
+                                        {...register("userName",
+                                            {
+                                                value: currentUserData.username,
+                                            })}
+                                        id='username'
+                                        disabled
+                                    />
+                                </Grid>
+                            </Grid>
+                        </Grid>
+
+                        <Grid item xs={12} s={12} md={12} lg={12} sx={{ml: 3, mr: 3, mb: 3}}>
+                            <Grid container alignItems={"center"}>
+                                <Grid item xs={4} s={4} md={4} lg={4}
+                                      sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}>
+                                    ID Type:
+                                </Grid>
+
+                                <Grid item xs={7} s={7} md={7} lg={6}>
+                                    <TextField
+                                        fullWidth
+                                        {...register("idDocType")}
+                                        id='idDocType'
+                                        disabled
+                                    />
+                                </Grid>
+                            </Grid>
+                        </Grid>
+
+
+                        <Grid item xs={12} s={12} md={12} lg={12} sx={{ml: 3, mr: 3, mb: 3}}>
+                            <Grid container alignItems={"center"}>
+                                <Grid item xs={4} s={4} md={4} lg={4}
+                                      sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}>
+                                    Identification No.:
+                                </Grid>
+
+                                <Grid item xs={7} s={7} md={7} lg={6}>
+                                    <TextField
+                                        fullWidth
+                                        {...register("identification")}
+                                        id='identification'
+                                        disabled
+                                    />
+                                </Grid>
+                            </Grid>
+                        </Grid>
+
+                        <Grid item xs={12} s={12} md={12} lg={12} sx={{ml: 3, mr: 3, mb: 3}}>
+                            <Grid container alignItems={"center"}>
+                                <Grid item xs={4} s={4} md={4} lg={4}
+                                      sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}>
+                                    English Name:
+                                </Grid>
+
+                                <Grid item xs={7} s={7} md={7} lg={6}>
+                                    <TextField
+                                        fullWidth
+                                        {...register("enName",
+                                            {
+                                                value: currentUserData.fullname,
+                                            })}
+                                        id='enName'
+                                        disabled={readOnly}
+                                    />
+                                </Grid>
+                            </Grid>
+                        </Grid>
+
+                        <Grid item xs={12} s={12} md={12} lg={12} sx={{ml: 3, mr: 3, mb: 3}}>
+                            <Grid container alignItems={"center"}>
+                                <Grid item xs={4} s={4} md={4} lg={4}
+                                      sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}>
+                                    Chinese Name:
+                                </Grid>
+
+                                <Grid item xs={7} s={7} md={7} lg={6}>
+                                    <TextField
+                                        fullWidth
+                                        {...register("chName",
+                                            {
+                                                value: currentUserData.fullname,
+                                            })}
+                                        id='chName'
+                                        disabled={readOnly}
+                                    />
+                                </Grid>
+                            </Grid>
+                        </Grid>
+
+                        <Grid item xs={12} s={12} md={12} lg={12} sx={{ml: 3, mr: 3, mb: 3}}>
+                            <Grid container alignItems={"center"}>
+                                <Grid item xs={4} s={4} md={4} lg={4}
+                                      sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}>
+                                    Post:
+                                </Grid>
+
+                                <Grid item xs={7} s={7} md={7} lg={6}>
+                                    <TextField
+                                        fullWidth
+                                        {...register("post",
+                                            {
+                                                value: currentUserData.post,
+                                            })}
+                                        id='post'
+                                    />
+                                </Grid>
+                            </Grid>
+                        </Grid>
+
+                        <Grid item xs={12} s={12} md={12} lg={12} sx={{ml: 3, mr: 3, mb: 3}}>
+                            <Grid container alignItems={"center"}>
+                                <Grid item xs={4} s={4} md={4} lg={4}
+                                      sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}>
+                                    Email:
+                                </Grid>
+
+                                <Grid item xs={7} s={7} md={7} lg={6}>
+                                    <TextField
+                                        fullWidth
+                                        {...register("email",
+                                            {
+                                                value: currentUserData.email,
+                                            })}
+                                        id='email'
+                                    />
+                                </Grid>
+                            </Grid>
+                        </Grid>
+
+                        <Grid item xs={12} s={12} md={12} lg={12} sx={{ml: 3, mr: 3, mb: 3}}>
+                            <Grid container alignItems={"center"}>
+                                <Grid item xs={4} s={4} md={4} lg={4}
+                                      sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}>
+                                    Phone:
+                                </Grid>
+
+                                <Grid item xs={7} s={7} md={7} lg={6}>
+                                    <TextField
+                                        fullWidth
+                                        {...register("phone1",
+                                            {
+                                                value: currentUserData.phone1,
+                                            })}
+                                        id='phone1'
+                                    />
+                                </Grid>
+                            </Grid>
+                        </Grid>
+
+                        <Grid item xs={12} s={12} md={12} lg={12} sx={{ml: 3, mr: 3, mb: 3}}>
+                            <Grid container>
+                                <Grid item xs={4} s={4} md={4} lg={4}
+                                      sx={{ml: 3, mr: 3, display: 'flex', alignItems: 'center'}}>
+                                    Locked:
+                                </Grid>
+
+                                <Grid item xs={7} s={7} md={7} lg={6}>
+                                    <Checkbox
+                                        checked={locked}
+                                        onChange={(event) => setLocked(event.target.checked)}
+                                        name="checked"
+                                        color="primary"
+                                        size="small"
+                                    />
+                                </Grid>
+                            </Grid>
+                        </Grid>
+
+                    </Grid>
+
+                </form>
+            </MainCard>
+    );
+};
+
+export default UserInformationCard_Public;
diff --git a/src/pages/pnspsUserDetailPage_Public/index.js b/src/pages/pnspsUserDetailPage_Public/index.js
new file mode 100644
index 0000000..65681d2
--- /dev/null
+++ b/src/pages/pnspsUserDetailPage_Public/index.js
@@ -0,0 +1,107 @@
+// material-ui
+import {
+    Button,
+    Grid, Typography
+} from '@mui/material';
+import {useEffect, useState} from "react";
+import * as React from "react";
+import axios from "axios";
+import {apiPath} from "../../auth/utils";
+import {useParams} from "react-router-dom";
+import UserInformationCard from "./UserInformationCard_Public";
+import LoadingComponent from "../extra-pages/LoadingComponent";
+import {GET_USER_PATH} from "../../utils/ApiPathConst";
+
+// ==============================|| DASHBOARD - DEFAULT ||============================== //
+
+
+const UserMaintainPage_Public = () => {
+    const params = useParams();
+    const [userData, setUserData] = React.useState({});
+    const [onReady, setOnReady] = useState(false);
+    const [isCollectData, setIsCollectData] = useState(false);
+    const [editedCustomerData, setEditedCustomerData] = useState({});
+    const [userConfirm, setUserConfirm] = useState(false);
+
+    function updateUserObject(userData) {
+        setEditedCustomerData(userData);
+    }
+
+    const submitData = () => {
+        setUserConfirm(true);
+        setIsCollectData(!isCollectData);
+    }
+
+    useEffect(() => {
+        console.log(params)
+        axios.get(`${apiPath}${GET_USER_PATH}/${params.id}`)
+            .then((response) => {
+                if (response.status === 200) {
+                    setUserData(response.data);
+                }
+            })
+            .catch(error => {
+                console.log(error);
+                return false;
+            });
+    }, []);
+
+    useEffect(() => {
+        setOnReady(true);
+    }, [userData]);
+
+    useEffect(() => {
+        if(userConfirm && onReady){
+            console.log("update in parents");
+            console.log(editedCustomerData);
+        }
+        setUserConfirm(false);
+    }, [editedCustomerData]);
+
+    return (
+        !onReady ?
+            <LoadingComponent/>
+            :
+            <Grid container rowSpacing={4.5} columnSpacing={2.75}>
+                <Grid item xs={12} sx={{mb: -2.25}}>
+                    <Typography variant="h5">Maintain User</Typography>
+                </Grid>
+                {/*col 1*/}
+                <Grid item xs={12} md={5} lg={5}>
+                    <Grid container>
+                        <Grid item xs={12} md={12} lg={12}>
+                            <UserInformationCard
+                                updateUserObject={updateUserObject}
+                                userData={userData}
+                                isCollectData={isCollectData}
+                            />
+                        </Grid>
+
+                    </Grid>
+                </Grid>
+                {/*col 2*/}
+
+                {/*bottom button*/}
+                <Grid item s={12} md={12} lg={12} sx={{mb: 3}} alignItems={"end"} justifyContent="center">
+                    <Grid container maxWidth justifyContent="flex-end">
+                        <Grid item sx={{ml: 3, mr: 3}}>
+                            <Button
+                                size="large"
+                                variant="contained"
+                                type="submit"
+                                sx={{
+                                    textTransform: 'capitalize',
+                                    alignItems: 'end'
+                                }}
+                                onClick={submitData}
+                            >
+                                Save User
+                            </Button>
+                        </Grid>
+                    </Grid>
+                </Grid>
+            </Grid>
+    );
+};
+
+export default UserMaintainPage_Public;
diff --git a/src/pages/pnspsUserSearchPage_Public/UserSearchForm_Public.js b/src/pages/pnspsUserSearchPage_Public/UserSearchForm_Public.js
index d96833f..b448c2f 100644
--- a/src/pages/pnspsUserSearchPage_Public/UserSearchForm_Public.js
+++ b/src/pages/pnspsUserSearchPage_Public/UserSearchForm_Public.js
@@ -8,35 +8,15 @@ import {
 import MainCard from "../../components/MainCard";
 import {useForm} from "react-hook-form";
 
-import {useEffect, useState} from "react";
-import Autocomplete from '@mui/material/Autocomplete';
-import {
-    subDivision1,
-    subDivision2,
-    subDivision3,
-    subDivision4,
-    subDivision5,
-    subDivision6
-} from "pages/pnspsUserSettingPage/DummyComboRecord";
+import { useState} from "react";
 import Checkbox from "@mui/material/Checkbox";
 import * as React from "react";
 // ==============================|| DASHBOARD - DEFAULT ||============================== //
 
-const subDivisionArray =[
-        ...subDivision1,
-        ...subDivision2,
-        ...subDivision3,
-        ...subDivision4,
-        ...subDivision5,
-        ...subDivision6
-];
 
 const UserSearchForm_Public = ({applySearch}) => {
 
     const [type, setType] = useState([]);
-    const [division, setDivision] = useState(null);
-    const [subDivision, setSubDivision] = useState(null);
-    const [isLotusNoteUser, setIsLotusNoteUser] = useState(false);
     const [locked, setLocked] = useState(false);
 
 
@@ -52,27 +32,15 @@ const UserSearchForm_Public = ({applySearch}) => {
         const temp = {
             username: data.userName,
             fullName: data.fullName,
-            subDivision: subDivision,
             email: data.email,
             phone: data.phone,
-            isLotusNoteUser: isLotusNoteUser,
             locked: locked,
         };
         applySearch(temp);
     };
 
-    useEffect(() => {
-        if(division != null){
-            setSubDivision(subDivisionArray[division.type-1][0]);
-        }
-
-    }, [division]);
-
     function resetForm(){
         setType([]);
-        setDivision(null);
-        setSubDivision(null);
-        setIsLotusNoteUser(false);
         setLocked(false);
         reset();
     }
@@ -110,19 +78,6 @@ const UserSearchForm_Public = ({applySearch}) => {
                         />
                     </Grid>
 
-                    <Grid item xs={9} s={6} md={5} lg={3} sx={{ml:3, mr:3, mb:3}}>
-                        <Autocomplete
-                            disablePortal
-                            id="sub-division-combo"
-                            value={subDivision === null? null : subDivision}
-                            options={subDivisionArray}
-                            onChange={(event, newValue) => {
-                                setSubDivision(newValue);
-                            }}
-                            renderInput={(params) => <TextField {...params} label="Sub-Division" />}
-                        />
-                    </Grid>
-
                     <Grid item xs={9} s={6} md={5} lg={3} sx={{ml:3, mr:3, mb:3}}>
                         <TextField
                             fullWidth
@@ -141,21 +96,6 @@ const UserSearchForm_Public = ({applySearch}) => {
                         />
                     </Grid>
 
-                    <Grid item xs={9} s={6} md={5} lg={3} sx={{ml:3, mr:3, mb:3}}>
-                        <FormControlLabel
-                            control={
-                                <Checkbox
-                                    checked={isLotusNoteUser}
-                                    onChange={(event) => setIsLotusNoteUser(event.target.checked)}
-                                    name="checked"
-                                    color="primary"
-                                    size="small"
-                                />
-                            }
-                            label={<Typography variant="h6">Lotus Notes User</Typography>}
-                        />
-                    </Grid>
-
                     <Grid item xs={9} s={6} md={5} lg={3} sx={{ml:3, mr:3, mb:3}}>
                         <FormControlLabel
                             control={
diff --git a/src/pages/pnspsUserSearchPage_Public/UserTable_Public.js b/src/pages/pnspsUserSearchPage_Public/UserTable_Public.js
index 60570d7..a8aa065 100644
--- a/src/pages/pnspsUserSearchPage_Public/UserTable_Public.js
+++ b/src/pages/pnspsUserSearchPage_Public/UserTable_Public.js
@@ -4,7 +4,7 @@ import {
     DataGrid,
     GridActionsCellItem,
 } from "@mui/x-data-grid";
-import EditIcon from '@mui/icons-material/Edit';
+import VisibilityIcon from '@mui/icons-material/Visibility';
 import {useEffect} from "react";
 import {useNavigate} from "react-router-dom";
 import { useTheme } from '@mui/material/styles';
@@ -22,8 +22,8 @@ export default function UserTable_Public({recordList}) {
         setRows(recordList);
     }, [recordList]);
 
-    const handleEditClick = (id) => () => {
-        navigate('/user/'+ id);
+    const handleActionClick = (id) => () => {
+        navigate('/publicUser/'+ id);
     };
 
     const columns = [
@@ -37,10 +37,10 @@ export default function UserTable_Public({recordList}) {
                 return [
                     <GridActionsCellItem
                         key="OutSave"
-                        icon={<EditIcon/>}
-                        label="Edit"
+                        icon={<VisibilityIcon/>}
+                        label="View"
                         className="textPrimary"
-                        onClick={handleEditClick(id)}
+                        onClick={handleActionClick(id)}
                         color="primary"
                     />]
             },
@@ -57,45 +57,12 @@ export default function UserTable_Public({recordList}) {
             headerName: 'Full Name',
             flex: 1,
         },
-        {
-            id: 'post',
-            field: 'post',
-            headerName: 'Post',
-            flex: 1,
-        },
         {
             id: 'email',
             field: 'email',
             headerName: 'Email',
             flex: 1,
         },
-        {
-            id: 'subDivisionId',
-            field: 'subDivisionId',
-            //type: 'date',
-            //sortable: false,
-            headerName: 'Sub-Division',
-            flex: 1,
-        },
-        {
-            id: 'lotusNotesUser',
-            field: 'lotusNotesUser',
-            type: 'bool',
-            headerName: 'Lotus Notes User',
-            flex: 1,
-            renderCell: (params) => {
-                return (
-                    <Checkbox
-                        theme={theme}
-                        key="locked"
-                        checked={params.row.lotusNotesUser}
-                        color="primary"
-                        size="small"
-                        //onChange={handleChange}
-                    />
-                );
-            },
-        },
         {
             id: 'locked',
             field: 'locked',
diff --git a/src/pages/pnspsUserSearchPage_Public/index.js b/src/pages/pnspsUserSearchPage_Public/index.js
index ffb3719..bb9a5c0 100644
--- a/src/pages/pnspsUserSearchPage_Public/index.js
+++ b/src/pages/pnspsUserSearchPage_Public/index.js
@@ -8,7 +8,7 @@ import EventTable from "./UserTable_Public";
 import {useEffect, useState} from "react";
 import axios from "axios";
 import {apiPath} from "../../auth/utils";
-import {GET_USER_PATH} from "../../utils/ApiPathConst";
+import {GET_PUBLIC_USER_PATH} from "../../utils/ApiPathConst";
 import * as React from "react";
 import LoadingComponent from "../extra-pages/LoadingComponent";
 
@@ -33,7 +33,7 @@ const UserSearchPage_Public = () => {
     }, [searchCriteria]);
 
     function getUserList(){
-        axios.get(`${apiPath}${GET_USER_PATH}`,
+        axios.get(`${apiPath}${GET_PUBLIC_USER_PATH}`,
             {params: searchCriteria}
         )
             .then((response) => {
@@ -57,7 +57,7 @@ const UserSearchPage_Public = () => {
             :
         <Grid container rowSpacing={4.5} columnSpacing={2.75}>
             <Grid item xs={12} sx={{mb: -2.25}}>
-                <Typography variant="h5">View User</Typography>
+                <Typography variant="h5">View Public User</Typography>
             </Grid>
 
             {/*row 1*/}
diff --git a/src/routes/SettingRoutes.js b/src/routes/SettingRoutes.js
index ce5f4bc..493c096 100644
--- a/src/routes/SettingRoutes.js
+++ b/src/routes/SettingRoutes.js
@@ -9,6 +9,8 @@ const SettingPage = Loadable(lazy(() => import('pages/pnspsSettingPage')));
 const PasswordPolicyPage = Loadable(lazy(()=> import('pages/pnspsPasswordPolicyPage')))
 const UserSearchPage = Loadable(lazy(()=>import ('pages/pnspsUserSearchPage')));
 const UserMaintainPage = Loadable(lazy(() => import('pages/pnspsUserDetailPage')));
+const UserSearchPage_Public = Loadable(lazy(()=>import ('pages/pnspsUserSearchPage_Public')));
+const UserMaintainPage_Public = Loadable(lazy(() => import('pages/pnspsUserDetailPage_Public')));
 const UserGroupSearchPage = Loadable(lazy(() => import('pages/pnspsUserGroupSearchPage')));
 const UserGroupDetailPage = Loadable(lazy(() => import('pages/pnspsUserGroupDetailPage')));
 
@@ -31,12 +33,16 @@ const SettingRoutes = {
             element: <UserSearchPage />
         },
         {
-            path: 'publicUserSearchview',
+            path: '/user/:id',
+            element: <UserMaintainPage />
+        },
+        {
+            path: 'publicUser',
             element: <UserSearchPage_Public />
         },
         {
-            path: '/user/:id',
-            element: <UserMaintainPage />
+            path: '/publicUser/:id',
+            element: <UserMaintainPage_Public />
         },
         {
             path: 'setting',
diff --git a/src/utils/ApiPathConst.js b/src/utils/ApiPathConst.js
index 3408e3f..821fc0e 100644
--- a/src/utils/ApiPathConst.js
+++ b/src/utils/ApiPathConst.js
@@ -3,6 +3,7 @@ export const GET_GROUP_COMBO_PATH = "/group/combo"
 export const GET_GROUP_MEMBER_LIST_PATH = "/group/member"
 export const GET_GROUP_AUTH_LIST = "/group/auth/combo"
 export const GET_USER_PATH = "/user"
+export const GET_PUBLIC_USER_PATH = "/user/public"
 export const GET_AUTH_LIST = "/user/auth/combo"
 export const GET_USER_COMBO_LIST = "/user/combo"