diff --git a/src/pages/Membership/Membership.js b/src/pages/Membership/Membership.js
index 3db8042..c38a993 100644
--- a/src/pages/Membership/Membership.js
+++ b/src/pages/Membership/Membership.js
@@ -106,8 +106,9 @@ export const Membership = observer(() => {
   const columns = [
     {
       title: "Name",
-      dataIndex: "username",
-      key: "username",
+      dataIndex: "name",
+      key: "name",
+      render: (text, record) => record?.name ?? record?.username,
     },
     {
       title: "Username",
@@ -138,7 +139,7 @@ export const Membership = observer(() => {
       render: (text, record) => (
         <Space size="middle">
           <Button
-            type={record?.status === true ? "danger" : "primary"}
+            type={record?.isActive === true ? "danger" : "primary"}
             onClick={() => changeStatus(record?.id, record?.isActive)}
           >
             {record?.isActive === true ? "Inactive" : "Active"}
diff --git a/src/pages/Membership/MembershipModal.js b/src/pages/Membership/MembershipModal.js
index bfc0a59..bf8225d 100644
--- a/src/pages/Membership/MembershipModal.js
+++ b/src/pages/Membership/MembershipModal.js
@@ -52,6 +52,15 @@ export const MembershipModal = ({
         initialValues={initialData}
       >
         {((initialData.id && !initialData.isChangePassword) || !initialData.id) && (
+          <Form.Item
+            name="name"
+            label="Name"
+            rules={[{ required: true, message: "Please input Name!" }]}
+          >
+            <Input />
+          </Form.Item>
+        )}
+        {!initialData.id && (
           <Form.Item
             name="username"
             label="Username"
diff --git a/src/store/membership.js b/src/store/membership.js
index e6398fe..989bbf2 100644
--- a/src/store/membership.js
+++ b/src/store/membership.js
@@ -17,9 +17,13 @@ export class Membership {
          
         this.data = response.body.data.map((item, idx) => {
             item.key = idx;
-            item.roleName = item.roles.name;
+            item.name = item?.user_detail?.name;
+            item.roleId = item?.roles.id;
+            item.roleName = item?.roles.name;
             return item
         }) ?? []
+
+        console.log(JSON.stringify(this.data), "DATA");
         
         this.total_data = response.body.total_data ?? 0
     }
@@ -28,7 +32,9 @@ export class Membership {
         const response = await http.get(`/users/find-by-supperior?page=${this.page}&pageSize=${this.pageSize}`);
         this.data = response.body.data.map((item, idx) => {
             item.key = idx;
-            item.roleName = item.roles.name;
+            item.name = item?.user_detail?.name;
+            item.roleId = item?.roles.id;
+            item.roleName = item?.roles?.name;
             return item
         }) ?? []