diff --git a/ui/src/App.tsx b/ui/src/App.tsx
index 438c285e..bf6e0a32 100644
--- a/ui/src/App.tsx
+++ b/ui/src/App.tsx
@@ -9,7 +9,7 @@ import Home from "./views/Home"
 import Repo from "./views/Repo"
 import Deployment from "./views/Deployment"
 import Settings from "./views/Settings"
-import Members from "./views/Members"
+import Members from "./views/members"
 
 function App(): JSX.Element {
     return (
diff --git a/ui/src/components/MemberList.tsx b/ui/src/components/MemberList.tsx
deleted file mode 100644
index 1f89e902..00000000
--- a/ui/src/components/MemberList.tsx
+++ /dev/null
@@ -1,40 +0,0 @@
-import { List, Switch, Button, Avatar } from "antd"
-
-import { User } from "../models"
-
-interface MemberListProps {
-    users: User[]
-    onChangeSwitch(user: User, checked: boolean): void
-    onClickDelete(user: User): void
-}
-
-export default function MemberList(props: MemberListProps): JSX.Element {
-    return <List
-        itemLayout="horizontal"
-        dataSource={props.users}
-        renderItem={(u) => {
-            return <List.Item
-                actions={[
-                    <Switch 
-                        checkedChildren="Adm"  
-                        unCheckedChildren="Mem"
-                        checked={u.admin}
-                        onChange={(checked) => {props.onChangeSwitch(u, checked)}}
-                    />,
-                    <Button
-                        type="primary"
-                        danger
-                        onClick={() => {props.onClickDelete(u)}}
-                    >Delete</Button>
-                ]}
-            >
-                <List.Item.Meta 
-                    avatar={<Avatar src={u.avatar} />}
-                    title={u.login}
-                />
-            </List.Item>
-        }}
-    >
-
-    </List>
-}
\ No newline at end of file
diff --git a/ui/src/components/Pagination.tsx b/ui/src/components/Pagination.tsx
index e086e29d..8fd39864 100644
--- a/ui/src/components/Pagination.tsx
+++ b/ui/src/components/Pagination.tsx
@@ -1,19 +1,17 @@
 import { Button } from 'antd'
 
 interface PaginationProps {
-    page: number
-    isLast: boolean
+    disabledPrev: boolean
+    disabledNext: boolean
     onClickPrev(): void
     onClickNext(): void
 }
 
 export default function Pagination(props: PaginationProps): JSX.Element {
-    const isFirst = props.page <= 1
-
     return (
         <div>
-            <Button disabled={isFirst} onClick={props.onClickPrev} style={{borderTopRightRadius: 0, borderBottomRightRadius: 0}}>Prev</Button>
-            <Button disabled={props.isLast} onClick={props.onClickNext} style={{borderTopLeftRadius: 0, borderBottomLeftRadius: 0}}>Next</Button>
+            <Button disabled={props.disabledPrev} onClick={props.onClickPrev} style={{borderTopRightRadius: 0, borderBottomRightRadius: 0}}>Prev</Button>
+            <Button disabled={props.disabledNext} onClick={props.onClickNext} style={{borderTopLeftRadius: 0, borderBottomLeftRadius: 0}}>Next</Button>
         </div>
     )
 }
\ No newline at end of file
diff --git a/ui/src/views/Home.tsx b/ui/src/views/Home.tsx
index d93a318c..40a9842b 100644
--- a/ui/src/views/Home.tsx
+++ b/ui/src/views/Home.tsx
@@ -57,8 +57,6 @@ export default function Home(): JSX.Element {
         f()
     }
 
-    const isLast = repos.length < perPage
-
     if (loading) {
         return (
             <Main>
@@ -95,7 +93,12 @@ export default function Home(): JSX.Element {
                 <RepoList repos={repos}></RepoList>
             </div>
             <div style={{marginTop: "20px", textAlign: "center"}}>
-                <Pagination page={page} isLast={isLast} onClickPrev={onClickPrev} onClickNext={onClickNext} ></Pagination>
+                <Pagination 
+                    disabledPrev={page <= 1} 
+                    disabledNext={repos.length < perPage} 
+                    onClickPrev={onClickPrev} 
+                    onClickNext={onClickNext} 
+                />
             </div>
         </Main>
     )
diff --git a/ui/src/views/RepoHome.tsx b/ui/src/views/RepoHome.tsx
index 6f725a26..2e6c5fdd 100644
--- a/ui/src/views/RepoHome.tsx
+++ b/ui/src/views/RepoHome.tsx
@@ -46,8 +46,6 @@ export default function RepoHome(): JSX.Element {
         // eslint-disable-next-line
     }, [dispatch])
 
-    const isLast = deployments.length < perPage
-
     const onChangeEnv = (env: string) => {
         dispatch(slice.actions.setEnv(env))
         dispatch(fetchDeployments())
@@ -85,7 +83,12 @@ export default function RepoHome(): JSX.Element {
                 }
             </div>
             <div style={{marginTop: "20px", textAlign: "center"}}>
-                <Pagination page={page} isLast={isLast} onClickPrev={onClickPrev} onClickNext={onClickNext} ></Pagination>
+                <Pagination 
+                    disabledPrev={page <= 1} 
+                    disabledNext={deployments.length < perPage} 
+                    onClickPrev={onClickPrev} 
+                    onClickNext={onClickNext} 
+                />
             </div>
         </div>
     )
diff --git a/ui/src/views/members/MemberList.tsx b/ui/src/views/members/MemberList.tsx
new file mode 100644
index 00000000..f833560a
--- /dev/null
+++ b/ui/src/views/members/MemberList.tsx
@@ -0,0 +1,51 @@
+import { shallowEqual } from "react-redux"
+import { List, Switch, Button, Avatar } from "antd"
+
+import { useAppSelector, useAppDispatch } from "../../redux/hooks"
+import { updateUser, deleteUser } from "../../redux/members"
+
+import { User } from "../../models"
+
+export default function MemberList(): JSX.Element {
+    const { users } = useAppSelector(state => state.members, shallowEqual)
+    const dispatch = useAppDispatch()
+
+    const onChangeSwitch = (user: User, checked: boolean) => {
+        dispatch(updateUser({user, admin: checked}))
+    }
+
+    const onClickDelete = (user: User) => {
+        dispatch(deleteUser(user))
+    }
+
+    return (
+        <List
+            itemLayout="horizontal"
+            dataSource={users}
+            renderItem={(user) => (
+                <List.Item
+                    actions={[
+                        <Switch 
+                            checkedChildren="Adm"  
+                            unCheckedChildren="Mem"
+                            checked={user.admin}
+                            onChange={(checked) => {onChangeSwitch(user, checked)}}
+                        />,
+                        <Button
+                            type="primary"
+                            danger
+                            onClick={() => {onClickDelete(user)}}
+                        >
+                            Delete
+                        </Button>
+                    ]}
+                >
+                    <List.Item.Meta 
+                        avatar={<Avatar src={user.avatar} />}
+                        title={user.login}
+                    />
+                </List.Item>
+            )}
+        />
+    )
+}
\ No newline at end of file
diff --git a/ui/src/views/Members.tsx b/ui/src/views/members/index.tsx
similarity index 62%
rename from ui/src/views/Members.tsx
rename to ui/src/views/members/index.tsx
index 065363ba..304a716d 100644
--- a/ui/src/views/Members.tsx
+++ b/ui/src/views/members/index.tsx
@@ -3,18 +3,16 @@ import { shallowEqual } from "react-redux"
 import { Input } from "antd"
 import { Helmet } from "react-helmet"
 
-import { useAppSelector, useAppDispatch } from "../redux/hooks"
-import { membersSlice as slice, fetchUsers, updateUser, deleteUser, perPage } from "../redux/members"
+import { useAppSelector, useAppDispatch } from "../../redux/hooks"
+import { membersSlice as slice, fetchUsers, perPage } from "../../redux/members"
 
-import { User } from "../models"
-
-import Main from './Main'
-import MemberList from "../components/MemberList"
-import Pagination from "../components/Pagination"
+import Main from '../Main'
+import MemberList from "./MemberList"
+import Pagination from "../../components/Pagination"
 
 const { Search } = Input
 
-export default function Member(): JSX.Element {
+export default function Members(): JSX.Element {
     const { users, page } = useAppSelector(state => state.members, shallowEqual)
     const dispatch = useAppDispatch()
 
@@ -27,14 +25,6 @@ export default function Member(): JSX.Element {
         dispatch(fetchUsers())
     }
 
-    const onChangeSwitch = (user: User, checked: boolean) => {
-        dispatch(updateUser({user, admin: checked}))
-    }
-
-    const onClickDelete = (user: User) => {
-        dispatch(deleteUser(user))
-    }
-
     const onClickPrev = () => {
         dispatch(slice.actions.decreasePage())
         dispatch(fetchUsers())
@@ -57,16 +47,12 @@ export default function Member(): JSX.Element {
                 <Search placeholder="Search user ..." onSearch={onSearch} enterButton />
             </div>
             <div style={{marginTop: "40px"}}>
-                <MemberList
-                    users={users}
-                    onChangeSwitch={onChangeSwitch}
-                    onClickDelete={onClickDelete}
-                />
+                <MemberList/>
             </div>
             <div style={{marginTop: "40px", textAlign: "center"}}>
                 <Pagination 
-                    page={page}
-                    isLast={users.length !== perPage}
+                    disabledPrev={page <= 1}
+                    disabledNext={users.length < perPage}
                     onClickPrev={onClickPrev}
                     onClickNext={onClickNext}
                 />