+
Change Password
{!changingPassword ? (
-
+
) : (
-
- formProps.form?.setFieldsValue({ newPassword: e.target.value })}
- />
- formProps.form?.setFieldsValue({ confirmPassword: e.target.value })}
- />
+
+
)}
);
-};
\ No newline at end of file
+};
diff --git a/admin/src/pages/users/list.tsx b/admin/src/pages/users/list.tsx
index 85916ca..761857b 100644
--- a/admin/src/pages/users/list.tsx
+++ b/admin/src/pages/users/list.tsx
@@ -1,11 +1,11 @@
-import React from "react";
-import { List, useTable, DateField, TagField, FilterDropdown } from "@refinedev/antd";
-import { Table, Space, Tag, Button, Input } from "antd";
-import { SearchOutlined, EditOutlined, EyeOutlined } from "@ant-design/icons";
-import { useNavigation } from "@refinedev/core";
+import React, { useState, useEffect, useCallback } from 'react';
+import { List, useTable, DateField, TagField, FilterDropdown } from '@refinedev/antd';
+import { Table, Space, Tag, Button, Input } from 'antd';
+import { SearchOutlined, EditOutlined, EyeOutlined } from '@ant-design/icons';
+import { useNavigation } from '@refinedev/core';
export const UserList: React.FC = () => {
- const { tableProps } = useTable({
+ const { tableProps, setFilters, filters } = useTable({
syncWithLocation: true,
pagination: {
pageSize: 20,
@@ -14,6 +14,52 @@ export const UserList: React.FC = () => {
const { show, edit } = useNavigation();
+ // Get current search value from filters
+ const currentSearchValue = (() => {
+ const emailFilter = filters?.find(
+ filter =>
+ 'field' in filter &&
+ filter.field === 'email' &&
+ 'operator' in filter &&
+ filter.operator === 'contains',
+ );
+ return emailFilter && 'value' in emailFilter ? (emailFilter.value as string) : '';
+ })();
+
+ const [searchValue, setSearchValue] = useState(currentSearchValue);
+
+ // Sync search value with filters on mount and URL changes
+ useEffect(() => {
+ setSearchValue(currentSearchValue);
+ }, [currentSearchValue]);
+
+ // Debounced search function
+ const debouncedSearch = useCallback(
+ (() => {
+ let timeoutId: NodeJS.Timeout;
+ return (value: string) => {
+ clearTimeout(timeoutId);
+ timeoutId = setTimeout(() => {
+ if (value) {
+ setFilters(
+ [
+ {
+ field: 'email',
+ operator: 'contains',
+ value: value,
+ },
+ ],
+ 'replace',
+ );
+ } else {
+ setFilters([], 'replace');
+ }
+ }, 300); // 300ms debounce
+ };
+ })(),
+ [setFilters],
+ );
+
return (
{
placeholder="Search users..."
prefix={}
style={{ width: 300 }}
- onChange={(e) => {
+ value={searchValue}
+ onChange={e => {
const value = e.target.value;
- tableProps.onChange?.(
- {...tableProps.pagination, current: 1} as any,
- {email: value ? [{field: "email", operator: "contains", value}] : []} as any,
- {} as any,
- {} as any
- );
+ setSearchValue(value);
+ debouncedSearch(value);
}}
+ allowClear
/>
}
>
-
+
(
+ filterDropdown={props => (
@@ -53,35 +92,29 @@ export const UserList: React.FC = () => {
/>
- `${record.firstName || ""} ${record.lastName || ""}`.trim() || "-"
+ render={(_, record: any) =>
+ `${record.firstName || ''} ${record.lastName || ''}`.trim() || '-'
}
/>
(
-
- {value ? "Active" : "Inactive"}
-
+ render={value => (
+ {value ? 'Active' : 'Inactive'}
)}
/>
(
-
- {value ? "Verified" : "Unverified"}
-
+ render={value => (
+ {value ? 'Verified' : 'Unverified'}
)}
/>
(
-
- {value ? "Enabled" : "Disabled"}
-
+ render={value => (
+ {value ? 'Enabled' : 'Disabled'}
)}
/>
{
dataIndex="roles"
render={(roles: any[]) => (
- {roles?.map((role) => (
+ {roles?.map(role => (
))}
@@ -98,13 +131,13 @@ export const UserList: React.FC = () => {
}
+ render={value => }
sorter
/>
value ? : "-"}
+ render={value => (value ? : '-')}
/>
{
key={`view-${record.id}`}
size="small"
icon={}
- onClick={() => show("users", record.id)}
+ onClick={() => show('users', record.id)}
/>
}
- onClick={() => edit("users", record.id)}
+ onClick={() => edit('users', record.id)}
/>
)}
@@ -128,4 +161,4 @@ export const UserList: React.FC = () => {
);
-};
\ No newline at end of file
+};
diff --git a/admin/src/pages/users/show.tsx b/admin/src/pages/users/show.tsx
index 7792ee2..f1c5981 100644
--- a/admin/src/pages/users/show.tsx
+++ b/admin/src/pages/users/show.tsx
@@ -1,15 +1,15 @@
-import React from "react";
-import { Show, DateField, TextField, TagField } from "@refinedev/antd";
-import { useShow, useCustomMutation } from "@refinedev/core";
-import { Typography, Tag, Space, Card, Descriptions, Button, message } from "antd";
-import {
- LockOutlined,
- UnlockOutlined,
+import React from 'react';
+import { Show, DateField, TextField, TagField } from '@refinedev/antd';
+import { useShow, useCustomMutation } from '@refinedev/core';
+import { Typography, Tag, Space, Card, Descriptions, Button, message } from 'antd';
+import {
+ LockOutlined,
+ UnlockOutlined,
SafetyOutlined,
MailOutlined,
CheckCircleOutlined,
- CloseCircleOutlined
-} from "@ant-design/icons";
+ CloseCircleOutlined,
+} from '@ant-design/icons';
const { Title, Text } = Typography;
@@ -28,18 +28,18 @@ export const UserShow: React.FC = () => {
activateUser(
{
url: `users/${record?.id}/activate`,
- method: "patch",
+ method: 'patch',
values: { active: true },
},
{
onSuccess: () => {
- message.success("User activated successfully");
+ message.success('User activated successfully');
queryResult.refetch();
},
onError: () => {
- message.error("Failed to activate user");
+ message.error('Failed to activate user');
},
- }
+ },
);
};
@@ -47,18 +47,18 @@ export const UserShow: React.FC = () => {
deactivateUser(
{
url: `users/${record?.id}/activate`,
- method: "patch",
+ method: 'patch',
values: { active: false },
},
{
onSuccess: () => {
- message.success("User deactivated successfully");
+ message.success('User deactivated successfully');
queryResult.refetch();
},
onError: () => {
- message.error("Failed to deactivate user");
+ message.error('Failed to deactivate user');
},
- }
+ },
);
};
@@ -66,17 +66,17 @@ export const UserShow: React.FC = () => {
sendVerificationEmail(
{
url: `auth/email/send-verification`,
- method: "post",
+ method: 'post',
values: { email: record?.email },
},
{
onSuccess: () => {
- message.success("Verification email sent");
+ message.success('Verification email sent');
},
onError: () => {
- message.error("Failed to send verification email");
+ message.error('Failed to send verification email');
},
- }
+ },
);
};
@@ -103,19 +103,19 @@ export const UserShow: React.FC = () => {
-
+
-
+
-
- {record?.isActive ? "Active" : "Inactive"}
+
+ {record?.isActive ? 'Active' : 'Inactive'}
-
- {record?.otpEnabled ? "Enabled" : "Disabled"}
+
+ {record?.otpEnabled ? 'Enabled' : 'Disabled'}
@@ -139,7 +139,7 @@ export const UserShow: React.FC = () => {
Roles & Permissions
-
+
Roles:
@@ -151,7 +151,7 @@ export const UserShow: React.FC = () => {
)}
-
+
{record?.permissions && record.permissions.length > 0 && (
Permissions:
@@ -171,28 +171,17 @@ export const UserShow: React.FC = () => {
Actions
{record?.isActive ? (
- }
- onClick={handleDeactivate}
- >
+ } onClick={handleDeactivate}>
Deactivate User
) : (
- }
- onClick={handleActivate}
- >
+ } onClick={handleActivate}>
Activate User
)}
-
+
{!record?.emailVerified && (
- }
- onClick={handleSendVerification}
- >
+ } onClick={handleSendVerification}>
Send Verification Email
)}
@@ -200,4 +189,4 @@ export const UserShow: React.FC = () => {
);
-};
\ No newline at end of file
+};