feat: scss prettier fix

docs/api/openapi.yml

@@ -342,34 +342,6 @@ components:
         config:
           $ref: '#/components/schemas/AuthtypesAuthDomainConfig'
       type: object
-    AuthtypesUserWithRoles:
-      properties:
-        createdAt:
-          format: date-time
-          type: string
-        displayName:
-          type: string
-        email:
-          type: string
-        id:
-          type: string
-        isRoot:
-          type: boolean
-        orgId:
-          type: string
-        roles:
-          items:
-            $ref: '#/components/schemas/AuthtypesRole'
-          nullable: true
-          type: array
-        status:
-          type: string
-        updatedAt:
-          format: date-time
-          type: string
-      required:
-      - id
-      type: object
     CloudintegrationtypesAWSAccountConfig:
       properties:
         regions:
@@ -2675,25 +2647,6 @@ components:
       required:
       - id
       type: object
-    TypesUpdatableSelfUser:
-      properties:
-        displayName:
-          type: string
-      required:
-      - displayName
-      type: object
-    TypesUpdatableUser:
-      properties:
-        displayName:
-          type: string
-        roleNames:
-          items:
-            type: string
-          type: array
-      required:
-      - displayName
-      - roleNames
-      type: object
     TypesUser:
       properties:
         createdAt:
@@ -7828,66 +7781,6 @@ paths:
       summary: Readiness check
       tags:
       - health
-  /api/v2/roles/{id}/users:
-    get:
-      deprecated: false
-      description: This endpoint returns the users having the role by role id
-      operationId: GetUsersByRoleID
-      parameters:
-      - in: path
-        name: id
-        required: true
-        schema:
-          type: string
-      responses:
-        "200":
-          content:
-            application/json:
-              schema:
-                properties:
-                  data:
-                    items:
-                      $ref: '#/components/schemas/TypesUser'
-                    type: array
-                  status:
-                    type: string
-                required:
-                - status
-                - data
-                type: object
-          description: OK
-        "401":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Unauthorized
-        "403":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Forbidden
-        "404":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Not Found
-        "500":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Internal Server Error
-      security:
-      - api_key:
-        - ADMIN
-      - tokenizer:
-        - ADMIN
-      summary: Get users by role id
-      tags:
-      - users
   /api/v2/sessions:
     delete:
       deprecated: false
@@ -8046,306 +7939,6 @@ paths:
       summary: Rotate session
       tags:
       - sessions
-  /api/v2/users:
-    get:
-      deprecated: false
-      description: This endpoint lists all users for the organization
-      operationId: ListUsersV2
-      responses:
-        "200":
-          content:
-            application/json:
-              schema:
-                properties:
-                  data:
-                    items:
-                      $ref: '#/components/schemas/TypesUser'
-                    type: array
-                  status:
-                    type: string
-                required:
-                - status
-                - data
-                type: object
-          description: OK
-        "401":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Unauthorized
-        "403":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Forbidden
-        "500":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Internal Server Error
-      security:
-      - api_key:
-        - ADMIN
-      - tokenizer:
-        - ADMIN
-      summary: List users v2
-      tags:
-      - users
-  /api/v2/users/{id}:
-    get:
-      deprecated: false
-      description: This endpoint returns the user by id
-      operationId: GetUserV2
-      parameters:
-      - in: path
-        name: id
-        required: true
-        schema:
-          type: string
-      responses:
-        "200":
-          content:
-            application/json:
-              schema:
-                properties:
-                  data:
-                    $ref: '#/components/schemas/TypesUser'
-                  status:
-                    type: string
-                required:
-                - status
-                - data
-                type: object
-          description: OK
-        "401":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Unauthorized
-        "403":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Forbidden
-        "404":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Not Found
-        "500":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Internal Server Error
-      security:
-      - api_key:
-        - ADMIN
-      - tokenizer:
-        - ADMIN
-      summary: Get user by user id
-      tags:
-      - users
-    put:
-      deprecated: false
-      description: This endpoint updates the user by id
-      operationId: UpdateUserV2
-      parameters:
-      - in: path
-        name: id
-        required: true
-        schema:
-          type: string
-      requestBody:
-        content:
-          application/json:
-            schema:
-              $ref: '#/components/schemas/TypesUpdatableUser'
-      responses:
-        "204":
-          description: No Content
-        "400":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Bad Request
-        "401":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Unauthorized
-        "403":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Forbidden
-        "404":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Not Found
-        "500":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Internal Server Error
-      security:
-      - api_key:
-        - ADMIN
-      - tokenizer:
-        - ADMIN
-      summary: Update user v2
-      tags:
-      - users
-  /api/v2/users/{id}/roles:
-    get:
-      deprecated: false
-      description: This endpoint returns the user roles by user id
-      operationId: GetUserRoles
-      parameters:
-      - in: path
-        name: id
-        required: true
-        schema:
-          type: string
-      responses:
-        "200":
-          content:
-            application/json:
-              schema:
-                properties:
-                  data:
-                    items:
-                      $ref: '#/components/schemas/AuthtypesRole'
-                    type: array
-                  status:
-                    type: string
-                required:
-                - status
-                - data
-                type: object
-          description: OK
-        "401":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Unauthorized
-        "403":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Forbidden
-        "404":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Not Found
-        "500":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Internal Server Error
-      security:
-      - api_key:
-        - ADMIN
-      - tokenizer:
-        - ADMIN
-      summary: Get user roles
-      tags:
-      - users
-  /api/v2/users/me:
-    get:
-      deprecated: false
-      description: This endpoint returns the user I belong to
-      operationId: GetMyUserV2
-      responses:
-        "200":
-          content:
-            application/json:
-              schema:
-                properties:
-                  data:
-                    $ref: '#/components/schemas/AuthtypesUserWithRoles'
-                  status:
-                    type: string
-                required:
-                - status
-                - data
-                type: object
-          description: OK
-        "401":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Unauthorized
-        "403":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Forbidden
-        "500":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Internal Server Error
-      security:
-      - tokenizer: []
-      summary: Get my user v2
-      tags:
-      - users
-    put:
-      deprecated: false
-      description: This endpoint updates the user I belong to
-      operationId: UpdateMyUserV2
-      requestBody:
-        content:
-          application/json:
-            schema:
-              $ref: '#/components/schemas/TypesUpdatableSelfUser'
-      responses:
-        "204":
-          description: No Content
-        "401":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Unauthorized
-        "403":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Forbidden
-        "500":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Internal Server Error
-      security:
-      - tokenizer: []
-      summary: Update my user v2
-      tags:
-      - users
   /api/v2/zeus/hosts:
     get:
       deprecated: false

frontend/package.json

@@ -68,8 +68,8 @@
     "@signozhq/toggle-group": "0.0.1",
     "@signozhq/tooltip": "0.0.2",
     "@signozhq/ui": "0.0.5",
-    "@tanstack/react-table": "8.20.6",
-    "@tanstack/react-virtual": "3.11.2",
+    "@tanstack/react-table": "8.21.3",
+    "@tanstack/react-virtual": "3.13.22",
     "@uiw/codemirror-theme-copilot": "4.23.11",
     "@uiw/codemirror-theme-github": "4.24.1",
     "@uiw/react-codemirror": "4.23.10",

frontend/src/api/generated/services/sigNoz.schemas.ts

@@ -437,48 +437,6 @@ export interface AuthtypesUpdateableAuthDomainDTO {
 	config?: AuthtypesAuthDomainConfigDTO;
 }
 
-export interface AuthtypesUserWithRolesDTO {
-	/**
-	 * @type string
-	 * @format date-time
-	 */
-	createdAt?: Date;
-	/**
-	 * @type string
-	 */
-	displayName?: string;
-	/**
-	 * @type string
-	 */
-	email?: string;
-	/**
-	 * @type string
-	 */
-	id: string;
-	/**
-	 * @type boolean
-	 */
-	isRoot?: boolean;
-	/**
-	 * @type string
-	 */
-	orgId?: string;
-	/**
-	 * @type array
-	 * @nullable true
-	 */
-	roles?: AuthtypesRoleDTO[] | null;
-	/**
-	 * @type string
-	 */
-	status?: string;
-	/**
-	 * @type string
-	 * @format date-time
-	 */
-	updatedAt?: Date;
-}
-
 export interface CloudintegrationtypesAWSAccountConfigDTO {
 	/**
 	 * @type array
@@ -3186,24 +3144,6 @@ export interface TypesStorableAPIKeyDTO {
 	userId?: string;
 }
 
-export interface TypesUpdatableSelfUserDTO {
-	/**
-	 * @type string
-	 */
-	displayName: string;
-}
-
-export interface TypesUpdatableUserDTO {
-	/**
-	 * @type string
-	 */
-	displayName: string;
-	/**
-	 * @type array
-	 */
-	roleNames: string[];
-}
-
 export interface TypesUserDTO {
 	/**
 	 * @type string
@@ -4243,20 +4183,6 @@ export type Readyz503 = {
 	status: string;
 };
 
-export type GetUsersByRoleIDPathParameters = {
-	id: string;
-};
-export type GetUsersByRoleID200 = {
-	/**
-	 * @type array
-	 */
-	data: TypesUserDTO[];
-	/**
-	 * @type string
-	 */
-	status: string;
-};
-
 export type GetSessionContext200 = {
 	data: AuthtypesSessionContextDTO;
 	/**
@@ -4281,53 +4207,6 @@ export type RotateSession200 = {
 	status: string;
 };
 
-export type ListUsersV2200 = {
-	/**
-	 * @type array
-	 */
-	data: TypesUserDTO[];
-	/**
-	 * @type string
-	 */
-	status: string;
-};
-
-export type GetUserV2PathParameters = {
-	id: string;
-};
-export type GetUserV2200 = {
-	data: TypesUserDTO;
-	/**
-	 * @type string
-	 */
-	status: string;
-};
-
-export type UpdateUserV2PathParameters = {
-	id: string;
-};
-export type GetUserRolesPathParameters = {
-	id: string;
-};
-export type GetUserRoles200 = {
-	/**
-	 * @type array
-	 */
-	data: AuthtypesRoleDTO[];
-	/**
-	 * @type string
-	 */
-	status: string;
-};
-
-export type GetMyUserV2200 = {
-	data: AuthtypesUserWithRolesDTO;
-	/**
-	 * @type string
-	 */
-	status: string;
-};
-
 export type GetHosts200 = {
 	data: ZeustypesGettableHostDTO;
 	/**

frontend/src/api/generated/services/users/index.ts

@@ -25,20 +25,12 @@ import type {
 	CreateInvite201,
 	DeleteUserPathParameters,
 	GetMyUser200,
-	GetMyUserV2200,
 	GetResetPasswordToken200,
 	GetResetPasswordTokenPathParameters,
 	GetUser200,
 	GetUserPathParameters,
-	GetUserRoles200,
-	GetUserRolesPathParameters,
-	GetUsersByRoleID200,
-	GetUsersByRoleIDPathParameters,
-	GetUserV2PathParameters,
-	GetUserV2200,
 	ListAPIKeys200,
 	ListUsers200,
-	ListUsersV2200,
 	RenderErrorResponseDTO,
 	RevokeAPIKeyPathParameters,
 	TypesChangePasswordRequestDTO,
@@ -49,12 +41,9 @@ import type {
 	TypesPostableInviteDTO,
 	TypesPostableResetPasswordDTO,
 	TypesStorableAPIKeyDTO,
-	TypesUpdatableSelfUserDTO,
-	TypesUpdatableUserDTO,
 	UpdateAPIKeyPathParameters,
 	UpdateUser200,
 	UpdateUserPathParameters,
-	UpdateUserV2PathParameters,
 } from '../sigNoz.schemas';
 
 /**
@@ -1356,648 +1345,3 @@ export const useForgotPassword = <
 
 	return useMutation(mutationOptions);
 };
-/**
- * This endpoint returns the users having the role by role id
- * @summary Get users by role id
- */
-export const getUsersByRoleID = (
-	{ id }: GetUsersByRoleIDPathParameters,
-	signal?: AbortSignal,
-) => {
-	return GeneratedAPIInstance<GetUsersByRoleID200>({
-		url: `/api/v2/roles/${id}/users`,
-		method: 'GET',
-		signal,
-	});
-};
-
-export const getGetUsersByRoleIDQueryKey = ({
-	id,
-}: GetUsersByRoleIDPathParameters) => {
-	return [`/api/v2/roles/${id}/users`] as const;
-};
-
-export const getGetUsersByRoleIDQueryOptions = <
-	TData = Awaited<ReturnType<typeof getUsersByRoleID>>,
-	TError = ErrorType<RenderErrorResponseDTO>
->(
-	{ id }: GetUsersByRoleIDPathParameters,
-	options?: {
-		query?: UseQueryOptions<
-			Awaited<ReturnType<typeof getUsersByRoleID>>,
-			TError,
-			TData
-		>;
-	},
-) => {
-	const { query: queryOptions } = options ?? {};
-
-	const queryKey = queryOptions?.queryKey ?? getGetUsersByRoleIDQueryKey({ id });
-
-	const queryFn: QueryFunction<Awaited<ReturnType<typeof getUsersByRoleID>>> = ({
-		signal,
-	}) => getUsersByRoleID({ id }, signal);
-
-	return {
-		queryKey,
-		queryFn,
-		enabled: !!id,
-		...queryOptions,
-	} as UseQueryOptions<
-		Awaited<ReturnType<typeof getUsersByRoleID>>,
-		TError,
-		TData
-	> & { queryKey: QueryKey };
-};
-
-export type GetUsersByRoleIDQueryResult = NonNullable<
-	Awaited<ReturnType<typeof getUsersByRoleID>>
->;
-export type GetUsersByRoleIDQueryError = ErrorType<RenderErrorResponseDTO>;
-
-/**
- * @summary Get users by role id
- */
-
-export function useGetUsersByRoleID<
-	TData = Awaited<ReturnType<typeof getUsersByRoleID>>,
-	TError = ErrorType<RenderErrorResponseDTO>
->(
-	{ id }: GetUsersByRoleIDPathParameters,
-	options?: {
-		query?: UseQueryOptions<
-			Awaited<ReturnType<typeof getUsersByRoleID>>,
-			TError,
-			TData
-		>;
-	},
-): UseQueryResult<TData, TError> & { queryKey: QueryKey } {
-	const queryOptions = getGetUsersByRoleIDQueryOptions({ id }, options);
-
-	const query = useQuery(queryOptions) as UseQueryResult<TData, TError> & {
-		queryKey: QueryKey;
-	};
-
-	query.queryKey = queryOptions.queryKey;
-
-	return query;
-}
-
-/**
- * @summary Get users by role id
- */
-export const invalidateGetUsersByRoleID = async (
-	queryClient: QueryClient,
-	{ id }: GetUsersByRoleIDPathParameters,
-	options?: InvalidateOptions,
-): Promise<QueryClient> => {
-	await queryClient.invalidateQueries(
-		{ queryKey: getGetUsersByRoleIDQueryKey({ id }) },
-		options,
-	);
-
-	return queryClient;
-};
-
-/**
- * This endpoint lists all users for the organization
- * @summary List users v2
- */
-export const listUsersV2 = (signal?: AbortSignal) => {
-	return GeneratedAPIInstance<ListUsersV2200>({
-		url: `/api/v2/users`,
-		method: 'GET',
-		signal,
-	});
-};
-
-export const getListUsersV2QueryKey = () => {
-	return [`/api/v2/users`] as const;
-};
-
-export const getListUsersV2QueryOptions = <
-	TData = Awaited<ReturnType<typeof listUsersV2>>,
-	TError = ErrorType<RenderErrorResponseDTO>
->(options?: {
-	query?: UseQueryOptions<
-		Awaited<ReturnType<typeof listUsersV2>>,
-		TError,
-		TData
-	>;
-}) => {
-	const { query: queryOptions } = options ?? {};
-
-	const queryKey = queryOptions?.queryKey ?? getListUsersV2QueryKey();
-
-	const queryFn: QueryFunction<Awaited<ReturnType<typeof listUsersV2>>> = ({
-		signal,
-	}) => listUsersV2(signal);
-
-	return { queryKey, queryFn, ...queryOptions } as UseQueryOptions<
-		Awaited<ReturnType<typeof listUsersV2>>,
-		TError,
-		TData
-	> & { queryKey: QueryKey };
-};
-
-export type ListUsersV2QueryResult = NonNullable<
-	Awaited<ReturnType<typeof listUsersV2>>
->;
-export type ListUsersV2QueryError = ErrorType<RenderErrorResponseDTO>;
-
-/**
- * @summary List users v2
- */
-
-export function useListUsersV2<
-	TData = Awaited<ReturnType<typeof listUsersV2>>,
-	TError = ErrorType<RenderErrorResponseDTO>
->(options?: {
-	query?: UseQueryOptions<
-		Awaited<ReturnType<typeof listUsersV2>>,
-		TError,
-		TData
-	>;
-}): UseQueryResult<TData, TError> & { queryKey: QueryKey } {
-	const queryOptions = getListUsersV2QueryOptions(options);
-
-	const query = useQuery(queryOptions) as UseQueryResult<TData, TError> & {
-		queryKey: QueryKey;
-	};
-
-	query.queryKey = queryOptions.queryKey;
-
-	return query;
-}
-
-/**
- * @summary List users v2
- */
-export const invalidateListUsersV2 = async (
-	queryClient: QueryClient,
-	options?: InvalidateOptions,
-): Promise<QueryClient> => {
-	await queryClient.invalidateQueries(
-		{ queryKey: getListUsersV2QueryKey() },
-		options,
-	);
-
-	return queryClient;
-};
-
-/**
- * This endpoint returns the user by id
- * @summary Get user by user id
- */
-export const getUserV2 = (
-	{ id }: GetUserV2PathParameters,
-	signal?: AbortSignal,
-) => {
-	return GeneratedAPIInstance<GetUserV2200>({
-		url: `/api/v2/users/${id}`,
-		method: 'GET',
-		signal,
-	});
-};
-
-export const getGetUserV2QueryKey = ({ id }: GetUserV2PathParameters) => {
-	return [`/api/v2/users/${id}`] as const;
-};
-
-export const getGetUserV2QueryOptions = <
-	TData = Awaited<ReturnType<typeof getUserV2>>,
-	TError = ErrorType<RenderErrorResponseDTO>
->(
-	{ id }: GetUserV2PathParameters,
-	options?: {
-		query?: UseQueryOptions<Awaited<ReturnType<typeof getUserV2>>, TError, TData>;
-	},
-) => {
-	const { query: queryOptions } = options ?? {};
-
-	const queryKey = queryOptions?.queryKey ?? getGetUserV2QueryKey({ id });
-
-	const queryFn: QueryFunction<Awaited<ReturnType<typeof getUserV2>>> = ({
-		signal,
-	}) => getUserV2({ id }, signal);
-
-	return {
-		queryKey,
-		queryFn,
-		enabled: !!id,
-		...queryOptions,
-	} as UseQueryOptions<Awaited<ReturnType<typeof getUserV2>>, TError, TData> & {
-		queryKey: QueryKey;
-	};
-};
-
-export type GetUserV2QueryResult = NonNullable<
-	Awaited<ReturnType<typeof getUserV2>>
->;
-export type GetUserV2QueryError = ErrorType<RenderErrorResponseDTO>;
-
-/**
- * @summary Get user by user id
- */
-
-export function useGetUserV2<
-	TData = Awaited<ReturnType<typeof getUserV2>>,
-	TError = ErrorType<RenderErrorResponseDTO>
->(
-	{ id }: GetUserV2PathParameters,
-	options?: {
-		query?: UseQueryOptions<Awaited<ReturnType<typeof getUserV2>>, TError, TData>;
-	},
-): UseQueryResult<TData, TError> & { queryKey: QueryKey } {
-	const queryOptions = getGetUserV2QueryOptions({ id }, options);
-
-	const query = useQuery(queryOptions) as UseQueryResult<TData, TError> & {
-		queryKey: QueryKey;
-	};
-
-	query.queryKey = queryOptions.queryKey;
-
-	return query;
-}
-
-/**
- * @summary Get user by user id
- */
-export const invalidateGetUserV2 = async (
-	queryClient: QueryClient,
-	{ id }: GetUserV2PathParameters,
-	options?: InvalidateOptions,
-): Promise<QueryClient> => {
-	await queryClient.invalidateQueries(
-		{ queryKey: getGetUserV2QueryKey({ id }) },
-		options,
-	);
-
-	return queryClient;
-};
-
-/**
- * This endpoint updates the user by id
- * @summary Update user v2
- */
-export const updateUserV2 = (
-	{ id }: UpdateUserV2PathParameters,
-	typesUpdatableUserDTO: BodyType<TypesUpdatableUserDTO>,
-) => {
-	return GeneratedAPIInstance<void>({
-		url: `/api/v2/users/${id}`,
-		method: 'PUT',
-		headers: { 'Content-Type': 'application/json' },
-		data: typesUpdatableUserDTO,
-	});
-};
-
-export const getUpdateUserV2MutationOptions = <
-	TError = ErrorType<RenderErrorResponseDTO>,
-	TContext = unknown
->(options?: {
-	mutation?: UseMutationOptions<
-		Awaited<ReturnType<typeof updateUserV2>>,
-		TError,
-		{
-			pathParams: UpdateUserV2PathParameters;
-			data: BodyType<TypesUpdatableUserDTO>;
-		},
-		TContext
-	>;
-}): UseMutationOptions<
-	Awaited<ReturnType<typeof updateUserV2>>,
-	TError,
-	{
-		pathParams: UpdateUserV2PathParameters;
-		data: BodyType<TypesUpdatableUserDTO>;
-	},
-	TContext
-> => {
-	const mutationKey = ['updateUserV2'];
-	const { mutation: mutationOptions } = options
-		? options.mutation &&
-		  'mutationKey' in options.mutation &&
-		  options.mutation.mutationKey
-			? options
-			: { ...options, mutation: { ...options.mutation, mutationKey } }
-		: { mutation: { mutationKey } };
-
-	const mutationFn: MutationFunction<
-		Awaited<ReturnType<typeof updateUserV2>>,
-		{
-			pathParams: UpdateUserV2PathParameters;
-			data: BodyType<TypesUpdatableUserDTO>;
-		}
-	> = (props) => {
-		const { pathParams, data } = props ?? {};
-
-		return updateUserV2(pathParams, data);
-	};
-
-	return { mutationFn, ...mutationOptions };
-};
-
-export type UpdateUserV2MutationResult = NonNullable<
-	Awaited<ReturnType<typeof updateUserV2>>
->;
-export type UpdateUserV2MutationBody = BodyType<TypesUpdatableUserDTO>;
-export type UpdateUserV2MutationError = ErrorType<RenderErrorResponseDTO>;
-
-/**
- * @summary Update user v2
- */
-export const useUpdateUserV2 = <
-	TError = ErrorType<RenderErrorResponseDTO>,
-	TContext = unknown
->(options?: {
-	mutation?: UseMutationOptions<
-		Awaited<ReturnType<typeof updateUserV2>>,
-		TError,
-		{
-			pathParams: UpdateUserV2PathParameters;
-			data: BodyType<TypesUpdatableUserDTO>;
-		},
-		TContext
-	>;
-}): UseMutationResult<
-	Awaited<ReturnType<typeof updateUserV2>>,
-	TError,
-	{
-		pathParams: UpdateUserV2PathParameters;
-		data: BodyType<TypesUpdatableUserDTO>;
-	},
-	TContext
-> => {
-	const mutationOptions = getUpdateUserV2MutationOptions(options);
-
-	return useMutation(mutationOptions);
-};
-/**
- * This endpoint returns the user roles by user id
- * @summary Get user roles
- */
-export const getUserRoles = (
-	{ id }: GetUserRolesPathParameters,
-	signal?: AbortSignal,
-) => {
-	return GeneratedAPIInstance<GetUserRoles200>({
-		url: `/api/v2/users/${id}/roles`,
-		method: 'GET',
-		signal,
-	});
-};
-
-export const getGetUserRolesQueryKey = ({ id }: GetUserRolesPathParameters) => {
-	return [`/api/v2/users/${id}/roles`] as const;
-};
-
-export const getGetUserRolesQueryOptions = <
-	TData = Awaited<ReturnType<typeof getUserRoles>>,
-	TError = ErrorType<RenderErrorResponseDTO>
->(
-	{ id }: GetUserRolesPathParameters,
-	options?: {
-		query?: UseQueryOptions<
-			Awaited<ReturnType<typeof getUserRoles>>,
-			TError,
-			TData
-		>;
-	},
-) => {
-	const { query: queryOptions } = options ?? {};
-
-	const queryKey = queryOptions?.queryKey ?? getGetUserRolesQueryKey({ id });
-
-	const queryFn: QueryFunction<Awaited<ReturnType<typeof getUserRoles>>> = ({
-		signal,
-	}) => getUserRoles({ id }, signal);
-
-	return {
-		queryKey,
-		queryFn,
-		enabled: !!id,
-		...queryOptions,
-	} as UseQueryOptions<
-		Awaited<ReturnType<typeof getUserRoles>>,
-		TError,
-		TData
-	> & { queryKey: QueryKey };
-};
-
-export type GetUserRolesQueryResult = NonNullable<
-	Awaited<ReturnType<typeof getUserRoles>>
->;
-export type GetUserRolesQueryError = ErrorType<RenderErrorResponseDTO>;
-
-/**
- * @summary Get user roles
- */
-
-export function useGetUserRoles<
-	TData = Awaited<ReturnType<typeof getUserRoles>>,
-	TError = ErrorType<RenderErrorResponseDTO>
->(
-	{ id }: GetUserRolesPathParameters,
-	options?: {
-		query?: UseQueryOptions<
-			Awaited<ReturnType<typeof getUserRoles>>,
-			TError,
-			TData
-		>;
-	},
-): UseQueryResult<TData, TError> & { queryKey: QueryKey } {
-	const queryOptions = getGetUserRolesQueryOptions({ id }, options);
-
-	const query = useQuery(queryOptions) as UseQueryResult<TData, TError> & {
-		queryKey: QueryKey;
-	};
-
-	query.queryKey = queryOptions.queryKey;
-
-	return query;
-}
-
-/**
- * @summary Get user roles
- */
-export const invalidateGetUserRoles = async (
-	queryClient: QueryClient,
-	{ id }: GetUserRolesPathParameters,
-	options?: InvalidateOptions,
-): Promise<QueryClient> => {
-	await queryClient.invalidateQueries(
-		{ queryKey: getGetUserRolesQueryKey({ id }) },
-		options,
-	);
-
-	return queryClient;
-};
-
-/**
- * This endpoint returns the user I belong to
- * @summary Get my user v2
- */
-export const getMyUserV2 = (signal?: AbortSignal) => {
-	return GeneratedAPIInstance<GetMyUserV2200>({
-		url: `/api/v2/users/me`,
-		method: 'GET',
-		signal,
-	});
-};
-
-export const getGetMyUserV2QueryKey = () => {
-	return [`/api/v2/users/me`] as const;
-};
-
-export const getGetMyUserV2QueryOptions = <
-	TData = Awaited<ReturnType<typeof getMyUserV2>>,
-	TError = ErrorType<RenderErrorResponseDTO>
->(options?: {
-	query?: UseQueryOptions<
-		Awaited<ReturnType<typeof getMyUserV2>>,
-		TError,
-		TData
-	>;
-}) => {
-	const { query: queryOptions } = options ?? {};
-
-	const queryKey = queryOptions?.queryKey ?? getGetMyUserV2QueryKey();
-
-	const queryFn: QueryFunction<Awaited<ReturnType<typeof getMyUserV2>>> = ({
-		signal,
-	}) => getMyUserV2(signal);
-
-	return { queryKey, queryFn, ...queryOptions } as UseQueryOptions<
-		Awaited<ReturnType<typeof getMyUserV2>>,
-		TError,
-		TData
-	> & { queryKey: QueryKey };
-};
-
-export type GetMyUserV2QueryResult = NonNullable<
-	Awaited<ReturnType<typeof getMyUserV2>>
->;
-export type GetMyUserV2QueryError = ErrorType<RenderErrorResponseDTO>;
-
-/**
- * @summary Get my user v2
- */
-
-export function useGetMyUserV2<
-	TData = Awaited<ReturnType<typeof getMyUserV2>>,
-	TError = ErrorType<RenderErrorResponseDTO>
->(options?: {
-	query?: UseQueryOptions<
-		Awaited<ReturnType<typeof getMyUserV2>>,
-		TError,
-		TData
-	>;
-}): UseQueryResult<TData, TError> & { queryKey: QueryKey } {
-	const queryOptions = getGetMyUserV2QueryOptions(options);
-
-	const query = useQuery(queryOptions) as UseQueryResult<TData, TError> & {
-		queryKey: QueryKey;
-	};
-
-	query.queryKey = queryOptions.queryKey;
-
-	return query;
-}
-
-/**
- * @summary Get my user v2
- */
-export const invalidateGetMyUserV2 = async (
-	queryClient: QueryClient,
-	options?: InvalidateOptions,
-): Promise<QueryClient> => {
-	await queryClient.invalidateQueries(
-		{ queryKey: getGetMyUserV2QueryKey() },
-		options,
-	);
-
-	return queryClient;
-};
-
-/**
- * This endpoint updates the user I belong to
- * @summary Update my user v2
- */
-export const updateMyUserV2 = (
-	typesUpdatableSelfUserDTO: BodyType<TypesUpdatableSelfUserDTO>,
-) => {
-	return GeneratedAPIInstance<void>({
-		url: `/api/v2/users/me`,
-		method: 'PUT',
-		headers: { 'Content-Type': 'application/json' },
-		data: typesUpdatableSelfUserDTO,
-	});
-};
-
-export const getUpdateMyUserV2MutationOptions = <
-	TError = ErrorType<RenderErrorResponseDTO>,
-	TContext = unknown
->(options?: {
-	mutation?: UseMutationOptions<
-		Awaited<ReturnType<typeof updateMyUserV2>>,
-		TError,
-		{ data: BodyType<TypesUpdatableSelfUserDTO> },
-		TContext
-	>;
-}): UseMutationOptions<
-	Awaited<ReturnType<typeof updateMyUserV2>>,
-	TError,
-	{ data: BodyType<TypesUpdatableSelfUserDTO> },
-	TContext
-> => {
-	const mutationKey = ['updateMyUserV2'];
-	const { mutation: mutationOptions } = options
-		? options.mutation &&
-		  'mutationKey' in options.mutation &&
-		  options.mutation.mutationKey
-			? options
-			: { ...options, mutation: { ...options.mutation, mutationKey } }
-		: { mutation: { mutationKey } };
-
-	const mutationFn: MutationFunction<
-		Awaited<ReturnType<typeof updateMyUserV2>>,
-		{ data: BodyType<TypesUpdatableSelfUserDTO> }
-	> = (props) => {
-		const { data } = props ?? {};
-
-		return updateMyUserV2(data);
-	};
-
-	return { mutationFn, ...mutationOptions };
-};
-
-export type UpdateMyUserV2MutationResult = NonNullable<
-	Awaited<ReturnType<typeof updateMyUserV2>>
->;
-export type UpdateMyUserV2MutationBody = BodyType<TypesUpdatableSelfUserDTO>;
-export type UpdateMyUserV2MutationError = ErrorType<RenderErrorResponseDTO>;
-
-/**
- * @summary Update my user v2
- */
-export const useUpdateMyUserV2 = <
-	TError = ErrorType<RenderErrorResponseDTO>,
-	TContext = unknown
->(options?: {
-	mutation?: UseMutationOptions<
-		Awaited<ReturnType<typeof updateMyUserV2>>,
-		TError,
-		{ data: BodyType<TypesUpdatableSelfUserDTO> },
-		TContext
-	>;
-}): UseMutationResult<
-	Awaited<ReturnType<typeof updateMyUserV2>>,
-	TError,
-	{ data: BodyType<TypesUpdatableSelfUserDTO> },
-	TContext
-> => {
-	const mutationOptions = getUpdateMyUserV2MutationOptions(options);
-
-	return useMutation(mutationOptions);
-};

frontend/src/components/Logs/LogLinesActionButtons/LogLinesActionButtons.styles.scss

@@ -28,14 +28,22 @@
 	}
 }
 
+// In table/column view, keep action buttons visible at the viewport's right edge
+.log-line-action-buttons.table-view-log-actions {
+	position: absolute;
+	top: 50%;
+	right: 8px;
+	left: auto;
+	transform: translateY(-50%);
+	margin: 0;
+	z-index: 5;
+}
+
 .lightMode {
 	.log-line-action-buttons {
 		border: 1px solid var(--bg-vanilla-400);
 		background: var(--bg-vanilla-400);
 
-		.ant-btn-default {
-		}
-
 		.copy-log-btn {
 			border-left: 1px solid var(--bg-vanilla-400);
 			border-color: var(--bg-vanilla-400) !important;

frontend/src/components/Logs/TableView/config.ts

@@ -15,13 +15,12 @@ export function getDefaultCellStyle(isDarkMode?: boolean): CSSProperties {
 		letterSpacing: '-0.07px',
 		marginBottom: '0px',
 		minWidth: '10rem',
-		width: '10rem',
+		width: 'auto',
 	};
 }
 
 export const defaultTableStyle: CSSProperties = {
 	minWidth: '40rem',
-	maxWidth: '90rem',
 };
 
 export const defaultListViewPanelStyle: CSSProperties = {

frontend/src/components/Logs/TableView/useTableView.tsx

@@ -43,7 +43,7 @@ export const useTableView = (props: UseTableViewProps): UseTableViewResult => {
 	const bodyColumnStyle = useMemo(
 		() => ({
 			...defaultTableStyle,
-			...(fields.length > 2 ? { width: '50rem' } : {}),
+			...(fields.length > 2 ? { width: 'auto' } : {}),
 		}),
 		[fields.length],
 	);

frontend/src/components/QuickFilters/QuickFilters.styles.scss

@@ -1,21 +1,35 @@
 .quick-filters-container {
 	display: flex;
+	flex-direction: row;
 	height: 100%;
+	min-height: 0;
 	position: relative;
 
 	.quick-filters-settings-container {
+		flex: 0 0 0;
+		width: 0;
+		min-width: 0;
+		overflow: visible;
 		position: relative;
+		align-self: stretch;
 	}
 }
 
 .quick-filters {
 	display: flex;
 	flex-direction: column;
+	flex: 1 1 auto;
+	min-width: 0;
 	height: 100%;
-	width: 100%;
+	min-height: 0;
 	border-right: 1px solid var(--bg-slate-400);
 	color: var(--bg-vanilla-100);
 
+	.overlay-scrollbar {
+		flex: 1;
+		min-height: 0;
+	}
+
 	.header {
 		display: flex;
 		align-items: center;

frontend/src/components/QuickFilters/QuickFiltersSettings/QuickFiltersSettings.styles.scss

@@ -2,6 +2,8 @@
 	display: flex;
 	flex-direction: column;
 	position: absolute;
+	top: 0;
+	left: 0;
 	z-index: 999;
 	width: 342px;
 	background: var(--bg-slate-500);

frontend/src/constants/localStorage.ts

@@ -12,6 +12,7 @@ export enum LOCALSTORAGE {
 	GRAPH_VISIBILITY_STATES = 'GRAPH_VISIBILITY_STATES',
 	TRACES_LIST_COLUMNS = 'TRACES_LIST_COLUMNS',
 	LOGS_LIST_COLUMNS = 'LOGS_LIST_COLUMNS',
+	LOGS_LIST_COLUMN_SIZING = 'LOGS_LIST_COLUMN_SIZING',
 	LOGGED_IN_USER_NAME = 'LOGGED_IN_USER_NAME',
 	LOGGED_IN_USER_EMAIL = 'LOGGED_IN_USER_EMAIL',
 	CHAT_SUPPORT = 'CHAT_SUPPORT',

frontend/src/container/LiveLogs/LiveLogsContainer/LiveLogsContainer.styles.scss

@@ -1,3 +1,16 @@
+.live-logs-container {
+	display: flex;
+	flex: 1;
+	min-height: 0;
+}
+
+.live-logs-content {
+	display: flex;
+	flex: 1;
+	flex-direction: column;
+	min-height: 0;
+}
+
 .live-logs-chart-container {
 	height: 200px;
 	min-height: 200px;
@@ -5,6 +18,12 @@
 	border-right: none;
 }
 
+.live-logs-list-container {
+	display: flex;
+	flex: 1;
+	min-height: 0;
+}
+
 .live-logs-settings-panel {
 	display: flex;
 	align-items: center;

frontend/src/container/LiveLogs/LiveLogsList/LiveLogsList.styles.scss

@@ -18,6 +18,19 @@
 }
 
 .live-logs-list {
+	display: flex;
+	flex: 1;
+	flex-direction: column;
+	min-height: 0;
+
+	.ant-card,
+	.ant-card-body {
+		display: flex;
+		flex: 1;
+		min-height: 0;
+		flex-direction: column;
+	}
+
 	.live-logs-list-loading {
 		padding: 16px;
 		text-align: center;

frontend/src/container/LiveLogs/LiveLogsList/index.tsx

@@ -8,8 +8,8 @@ import OverlayScrollbar from 'components/OverlayScrollbar/OverlayScrollbar';
 import { CARD_BODY_STYLE } from 'constants/card';
 import { LOCALSTORAGE } from 'constants/localStorage';
 import { OptionFormatTypes } from 'constants/optionsFormatTypes';
-import InfinityTableView from 'container/LogsExplorerList/InfinityTableView';
 import { InfinityWrapperStyled } from 'container/LogsExplorerList/styles';
+import TanStackTableView from 'container/LogsExplorerList/TanStackTableView';
 import { convertKeysToColumnFields } from 'container/LogsExplorerList/utils';
 import { useOptionsMenu } from 'container/OptionsMenu';
 import { defaultLogsSelectedColumns } from 'container/OptionsMenu/constants';
@@ -50,11 +50,15 @@ function LiveLogsList({
 		[logs],
 	);
 
-	const { options } = useOptionsMenu({
+	const { options, config } = useOptionsMenu({
 		storageKey: LOCALSTORAGE.LOGS_LIST_OPTIONS,
 		dataSource: DataSource.LOGS,
 		aggregateOperator: StringOperators.NOOP,
 	});
+	const removableColumnKeys = useMemo(
+		() => options.selectColumns.map((column) => String(column.name)),
+		[options.selectColumns],
+	);
 
 	const activeLogIndex = useMemo(
 		() => formattedLogs.findIndex(({ id }) => id === activeLogId),
@@ -158,7 +162,7 @@ function LiveLogsList({
 			{formattedLogs.length !== 0 && (
 				<InfinityWrapperStyled>
 					{options.format === OptionFormatTypes.TABLE ? (
-						<InfinityTableView
+						<TanStackTableView
 							ref={ref}
 							isLoading={false}
 							tableViewProps={{
@@ -174,6 +178,8 @@ function LiveLogsList({
 							onSetActiveLog={handleSetActiveLog}
 							onClearActiveLog={handleCloseLogDetail}
 							activeLog={activeLog}
+							onRemoveColumn={config.addColumn?.onRemove}
+							removableColumnKeys={removableColumnKeys}
 						/>
 					) : (
 						<Card style={{ width: '100%' }} bodyStyle={CARD_BODY_STYLE}>

frontend/src/container/LogsExplorerList/InfinityTableView/config.ts

@@ -4,18 +4,11 @@ import { FontSize } from 'container/OptionsMenu/types';
 export const infinityDefaultStyles: CSSProperties = {
 	width: '100%',
 	overflowX: 'scroll',
-	marginTop: '15px',
 };
 
-export function getInfinityDefaultStyles(fontSize: FontSize): CSSProperties {
+export function getInfinityDefaultStyles(_fontSize: FontSize): CSSProperties {
 	return {
 		width: '100%',
 		overflowX: 'scroll',
-		marginTop:
-			fontSize === FontSize.SMALL
-				? '10px'
-				: fontSize === FontSize.MEDIUM
-				? '12px'
-				: '15px',
 	};
 }

frontend/src/container/LogsExplorerList/InfinityTableView/styles.ts

@@ -14,6 +14,78 @@ interface TableHeaderCellStyledProps {
 
 export const TableStyled = styled.table`
 	width: 100%;
+	border-collapse: separate;
+	border-spacing: 0;
+`;
+
+/**
+ * TanStack column sizing uses table-layout:fixed + colgroup widths; without clipping,
+ * cell content overflows visually on top of neighbouring columns (overlap / "ghost" text).
+ */
+export const TanStackTableStyled = styled(TableStyled)`
+	table-layout: fixed;
+	width: 100%;
+	min-width: 100%;
+	max-width: 100%;
+
+	& td,
+	& th {
+		overflow: hidden;
+		min-width: 0;
+		box-sizing: border-box;
+		vertical-align: top;
+	}
+
+	& td.table-actions-cell {
+		overflow: visible;
+	}
+
+	& td.body {
+		word-break: break-word;
+		overflow-wrap: anywhere;
+	}
+
+	/* Let nested body HTML / line-clamp shrink inside fixed columns */
+	& td.body > * {
+		min-width: 0;
+		max-width: 100%;
+	}
+
+	/* Long column titles: ellipsis when wider than the column (TanStackHeaderRow) */
+	& thead th .tanstack-header-title {
+		min-width: 0;
+		flex: 1 1 0;
+		overflow: hidden;
+		text-overflow: ellipsis;
+		white-space: nowrap;
+	}
+
+	& thead th .tanstack-header-title > * {
+		overflow: hidden;
+		text-overflow: ellipsis;
+		white-space: nowrap;
+		max-width: 100%;
+	}
+
+	& td.logs-table-filler-cell,
+	& th.logs-table-filler-header {
+		padding: 0 !important;
+		min-width: 0;
+		border-left: none;
+	}
+
+	& th.logs-table-actions-header {
+		position: sticky;
+		right: 0;
+		z-index: 2;
+		width: 0 !important;
+		min-width: 0 !important;
+		max-width: 0 !important;
+		padding: 0 !important;
+		overflow: visible;
+		white-space: nowrap;
+		border-left: none;
+	}
 `;
 
 const getTimestampColumnWidth = (
@@ -46,6 +118,19 @@ export const TableCellStyled = styled.td<TableHeaderCellStyledProps>`
 
 	${({ columnKey, $hasSingleColumn }): string =>
 		getTimestampColumnWidth(columnKey, $hasSingleColumn)}
+
+	&.table-actions-cell {
+		position: sticky;
+		right: 0;
+		z-index: 2;
+		width: 0;
+		min-width: 0;
+		max-width: 0;
+		padding: 0 !important;
+		white-space: nowrap;
+		overflow: visible;
+		background-color: inherit;
+	}
 `;
 
 export const TableRowStyled = styled.tr<{
@@ -64,7 +149,10 @@ export const TableRowStyled = styled.tr<{
 	position: relative;
 
 	.log-line-action-buttons {
-		display: none;
+		display: flex;
+		opacity: 0;
+		pointer-events: none;
+		transition: opacity 80ms linear;
 	}
 
 	&:hover {
@@ -73,13 +161,25 @@ export const TableRowStyled = styled.tr<{
 				getActiveLogBackground(true, $isDarkMode, $logType)}
 		}
 		.log-line-action-buttons {
-			display: flex;
+			opacity: 1;
+			pointer-events: auto;
 		}
 	}
+	${({ $isActiveLog }): string =>
+		$isActiveLog
+			? `
+		.log-line-action-buttons {
+			opacity: 1;
+			pointer-events: auto;
+		}
+	`
+			: ''}
 `;
 
 export const TableHeaderCellStyled = styled.th<TableHeaderCellStyledProps>`
 	padding: 0.5rem;
+	height: 36px;
+	text-align: left;
 	font-size: 14px;
 	font-style: normal;
 	font-weight: 400;
@@ -98,6 +198,12 @@ export const TableHeaderCellStyled = styled.th<TableHeaderCellStyledProps>`
 			: ``};
 	${({ $isLogIndicator }): string =>
 		$isLogIndicator ? 'padding: 0px; width: 1%;' : ''}
+	border-top: 1px solid var(--l2-border);
+	border-bottom: 1px solid var(--l2-border);
+	box-shadow: inset 0 -1px 0 var(--l2-border);
+	&:first-child {
+		border-left: 1px solid var(--l2-border);
+	}
 	color: ${(props): string =>
 		props.$isDarkMode ? 'var(--bg-vanilla-100, #fff)' : themeColors.bckgGrey};
 

frontend/src/container/LogsExplorerList/InfinityTableView/types.ts

@@ -5,6 +5,9 @@ import { ILog } from 'types/api/logs/log';
 
 export type InfinityTableProps = {
 	isLoading?: boolean;
+	isFetching?: boolean;
+	onRemoveColumn?: (columnKey: string) => void;
+	removableColumnKeys?: string[];
 	tableViewProps: Omit<UseTableViewProps, 'onOpenLogsContext' | 'onClickExpand'>;
 	infitiyTableProps?: {
 		onEndReached: (index: number) => void;

frontend/src/container/LogsExplorerList/LogsExplorerList.style.scss

@@ -8,7 +8,7 @@
 	line-height: 18px;
 	letter-spacing: -0.005em;
 	text-align: left;
-	min-height: 500px;
+	min-height: 0;
 
 	.logs-list-table-view-container {
 		.data-table-container {
@@ -24,11 +24,11 @@
 						color: white !important;
 
 						.cursor-col-resize {
-							width: 3px !important;
+							width: 24px !important;
 							cursor: col-resize !important;
-							opacity: 0.5 !important;
-							background-color: var(--bg-ink-500) !important;
-							border: 1px solid var(--bg-ink-500) !important;
+							opacity: 1 !important;
+							background-color: transparent !important;
+							border: none !important;
 
 							&:hover {
 								opacity: 1 !important;
@@ -85,7 +85,7 @@
 			}
 
 			thead {
-				z-index: 0 !important;
+				z-index: 2 !important;
 			}
 
 			.log-state-indicator {

frontend/src/container/LogsExplorerList/TanStackTableView/TanStackCustomTableRow.tsx

@@ -0,0 +1,56 @@
+import { ComponentProps } from 'react';
+import { TableComponents } from 'react-virtuoso';
+import {
+	getLogIndicatorType,
+	getLogIndicatorTypeForTable,
+} from 'components/Logs/LogStateIndicator/utils';
+import { useCopyLogLink } from 'hooks/logs/useCopyLogLink';
+import { useIsDarkMode } from 'hooks/useDarkMode';
+import { ILog } from 'types/api/logs/log';
+
+import { TableRowStyled } from '../InfinityTableView/styles';
+import { TanStackTableRowData } from './types';
+
+type VirtuosoTableRowProps = ComponentProps<
+	NonNullable<TableComponents<TanStackTableRowData>['TableRow']>
+>;
+
+export type TanStackCustomTableRowProps = VirtuosoTableRowProps & {
+	activeLog?: ILog | null;
+	activeContextLog?: ILog | null;
+	logsById: Map<string, ILog>;
+};
+
+function TanStackCustomTableRow({
+	children,
+	item,
+	activeLog,
+	activeContextLog,
+	logsById,
+	...props
+}: TanStackCustomTableRowProps): JSX.Element {
+	const { isHighlighted } = useCopyLogLink(item.currentLog.id);
+	const isDarkMode = useIsDarkMode();
+	const rowId = String(item.currentLog.id ?? '');
+	const rowLog = logsById.get(rowId) || item.currentLog;
+	const logType = rowLog
+		? getLogIndicatorType(rowLog)
+		: getLogIndicatorTypeForTable(item.log);
+
+	return (
+		<TableRowStyled
+			{...props}
+			$isDarkMode={isDarkMode}
+			$isActiveLog={
+				isHighlighted ||
+				rowId === String(activeLog?.id ?? '') ||
+				rowId === String(activeContextLog?.id ?? '')
+			}
+			$logType={logType}
+		>
+			{children}
+		</TableRowStyled>
+	);
+}
+
+export default TanStackCustomTableRow;

frontend/src/container/LogsExplorerList/TanStackTableView/TanStackHeaderRow.styles.scss

@@ -0,0 +1,177 @@
+.tanstack-header-cell {
+	position: sticky;
+	top: 0;
+	z-index: 2;
+	padding: 0;
+	transform: translate3d(
+		var(--tanstack-header-translate-x, 0px),
+		var(--tanstack-header-translate-y, 0px),
+		0
+	);
+	transition: var(--tanstack-header-transition, none);
+
+	&.is-dragging {
+		opacity: 0.85;
+	}
+
+	&.is-resizing {
+		background: var(--bg-slate-500);
+	}
+}
+
+.lightMode .tanstack-header-cell.is-resizing {
+	background: var(--bg-vanilla-300);
+}
+
+.tanstack-header-content {
+	display: flex;
+	align-items: center;
+	height: 100%;
+	min-width: 0;
+	width: 100%;
+	cursor: default;
+	max-width: 100%;
+
+	&.has-resize-control {
+		max-width: calc(100% - 5px);
+	}
+
+	&.has-action-control {
+		max-width: calc(100% - 5px);
+	}
+
+	&.has-resize-control.has-action-control {
+		max-width: calc(100% - 10px);
+	}
+}
+
+.tanstack-grip-slot {
+	display: inline-flex;
+	align-items: center;
+	justify-content: center;
+	width: 18px;
+	height: 18px;
+	margin-right: 4px;
+	flex-shrink: 0;
+}
+
+.tanstack-grip-activator {
+	display: inline-flex;
+	align-items: center;
+	justify-content: center;
+	width: 12px;
+	height: 12px;
+	cursor: grab;
+	color: var(--text-vanilla-400);
+	opacity: 1;
+	touch-action: none;
+}
+
+.tanstack-header-action-trigger {
+	display: inline-flex;
+	align-items: center;
+	justify-content: center;
+	width: 20px;
+	height: 20px;
+	cursor: pointer;
+	flex-shrink: 0;
+	color: var(--text-vanilla-400);
+}
+
+.lightMode .tanstack-grip-activator,
+.lightMode .tanstack-header-action-trigger {
+	color: var(--text-ink-500);
+}
+
+.tanstack-column-actions-content {
+	width: 156px;
+	padding: 6px;
+	background: var(--bg-ink-400);
+	border-color: var(--l2-border);
+	border-radius: 8px;
+	box-shadow: 0 8px 20px var(--bg-ink-500);
+}
+
+.tanstack-remove-column-action {
+	display: flex;
+	align-items: center;
+	gap: 8px;
+	width: 100%;
+	min-height: 34px;
+	padding: 0 12px;
+	border: none;
+	border-radius: 6px;
+	background: transparent;
+	justify-content: flex-start;
+	cursor: pointer;
+	color: var(--bg-cherry-500);
+	font-size: 12px;
+	line-height: 16px;
+	font-weight: 500;
+	transition: background-color 120ms ease, color 120ms ease;
+
+	&:hover {
+		background: var(--bg-slate-500);
+		color: var(--bg-cherry-600);
+	}
+}
+
+.tanstack-remove-column-action-icon {
+	font-size: 11px;
+	color: var(--bg-cherry-500);
+	opacity: 0.95;
+}
+
+.lightMode .tanstack-column-actions-content {
+	background: var(--bg-vanilla-100);
+	border: 1px solid var(--l2-border);
+	box-shadow: 0 6px 16px var(--bg-slate-300);
+}
+
+.lightMode .tanstack-remove-column-action {
+	color: var(--bg-cherry-600);
+
+	&:hover {
+		background: var(--bg-vanilla-300);
+		color: var(--bg-cherry-700);
+	}
+}
+
+.lightMode .tanstack-remove-column-action-icon {
+	color: var(--bg-cherry-600);
+}
+
+.tanstack-header-cell .cursor-col-resize {
+	position: absolute;
+	top: 0;
+	right: 0;
+	bottom: 0;
+	width: 5px;
+	cursor: col-resize;
+	z-index: 10;
+	touch-action: none;
+	background: transparent;
+}
+
+.tanstack-header-cell.is-resizing .cursor-col-resize {
+	background: var(--bg-robin-300);
+}
+
+.tanstack-resize-handle-line {
+	position: absolute;
+	top: 0;
+	bottom: 0;
+	left: 50%;
+	width: 4px;
+	transform: translateX(-50%);
+	background: var(--l2-border);
+	opacity: 1;
+	pointer-events: none;
+	transition: background 120ms ease, width 120ms ease;
+}
+
+.tanstack-header-cell.is-resizing .tanstack-resize-handle-line {
+	width: 2px;
+	background: var(--bg-robin-500);
+	transition: none;
+}

frontend/src/container/LogsExplorerList/TanStackTableView/TanStackHeaderRow.tsx

@@ -0,0 +1,193 @@
+import type {
+	CSSProperties,
+	MouseEvent as ReactMouseEvent,
+	TouchEvent as ReactTouchEvent,
+} from 'react';
+import { useMemo } from 'react';
+import { CloseOutlined, MoreOutlined } from '@ant-design/icons';
+import { useSortable } from '@dnd-kit/sortable';
+import { Popover, PopoverContent, PopoverTrigger } from '@signozhq/popover';
+import { flexRender, Header as TanStackHeader } from '@tanstack/react-table';
+import { GripVertical } from 'lucide-react';
+
+import { TableHeaderCellStyled } from '../InfinityTableView/styles';
+import { InfinityTableProps } from '../InfinityTableView/types';
+import { OrderedColumn, TanStackTableRowData } from './types';
+import { getColumnId } from './utils';
+
+import './TanStackHeaderRow.styles.scss';
+
+type TanStackHeaderRowProps = {
+	column: OrderedColumn;
+	header?: TanStackHeader<TanStackTableRowData, unknown>;
+	isDarkMode: boolean;
+	fontSize: InfinityTableProps['tableViewProps']['fontSize'];
+	hasSingleColumn: boolean;
+	canRemoveColumn?: boolean;
+	onRemoveColumn?: (columnKey: string) => void;
+};
+
+const GRIP_ICON_SIZE = 12;
+// eslint-disable-next-line sonarjs/cognitive-complexity
+function TanStackHeaderRow({
+	column,
+	header,
+	isDarkMode,
+	fontSize,
+	hasSingleColumn,
+	canRemoveColumn = false,
+	onRemoveColumn,
+}: TanStackHeaderRowProps): JSX.Element {
+	const columnId = getColumnId(column);
+	const isDragColumn =
+		column.key !== 'expand' && column.key !== 'state-indicator';
+	const isResizableColumn = Boolean(header?.column.getCanResize());
+	const isColumnRemovable = Boolean(
+		canRemoveColumn &&
+			onRemoveColumn &&
+			column.key !== 'expand' &&
+			column.key !== 'state-indicator',
+	);
+	const isResizing = Boolean(header?.column.getIsResizing());
+	const resizeHandler = header?.getResizeHandler();
+	const headerText =
+		typeof column.title === 'string' && column.title
+			? column.title
+			: String(header?.id ?? columnId);
+	const headerTitleAttr = headerText.replace(/^\w/, (c) => c.toUpperCase());
+	const handleResizeStart = (
+		event: ReactMouseEvent<HTMLElement> | ReactTouchEvent<HTMLElement>,
+	): void => {
+		event.preventDefault();
+		event.stopPropagation();
+		resizeHandler?.(event);
+	};
+	const {
+		attributes,
+		listeners,
+		setNodeRef,
+		setActivatorNodeRef,
+		transform,
+		transition,
+		isDragging,
+	} = useSortable({
+		id: columnId,
+		disabled: !isDragColumn,
+	});
+	const headerCellStyle = useMemo(
+		() =>
+			({
+				'--tanstack-header-translate-x': `${Math.round(transform?.x ?? 0)}px`,
+				'--tanstack-header-translate-y': `${Math.round(transform?.y ?? 0)}px`,
+				'--tanstack-header-transition': isResizing ? 'none' : transition || 'none',
+			} as CSSProperties),
+		[isResizing, transform?.x, transform?.y, transition],
+	);
+	const headerCellClassName = [
+		'tanstack-header-cell',
+		isDragging ? 'is-dragging' : '',
+		isResizing ? 'is-resizing' : '',
+	]
+		.filter(Boolean)
+		.join(' ');
+	const headerContentClassName = [
+		'tanstack-header-content',
+		isResizableColumn ? 'has-resize-control' : '',
+		isColumnRemovable ? 'has-action-control' : '',
+	]
+		.filter(Boolean)
+		.join(' ');
+
+	return (
+		<TableHeaderCellStyled
+			ref={setNodeRef}
+			$isLogIndicator={column.key === 'state-indicator'}
+			$isDarkMode={isDarkMode}
+			$isDragColumn={false}
+			className={headerCellClassName}
+			key={columnId}
+			fontSize={fontSize}
+			$hasSingleColumn={hasSingleColumn}
+			style={headerCellStyle}
+		>
+			<span className={headerContentClassName}>
+				{isDragColumn ? (
+					<span className="tanstack-grip-slot">
+						<span
+							ref={setActivatorNodeRef}
+							{...attributes}
+							{...listeners}
+							role="button"
+							aria-label={`Drag ${String(
+								column.title || header?.id || columnId,
+							)} column`}
+							className="tanstack-grip-activator"
+						>
+							<GripVertical size={GRIP_ICON_SIZE} />
+						</span>
+					</span>
+				) : null}
+				<span className="tanstack-header-title" title={headerTitleAttr}>
+					{header
+						? flexRender(header.column.columnDef.header, header.getContext())
+						: String(column.title || '').replace(/^\w/, (c) => c.toUpperCase())}
+				</span>
+				{isColumnRemovable && (
+					<Popover>
+						<PopoverTrigger asChild>
+							<span
+								role="button"
+								aria-label={`Column actions for ${headerTitleAttr}`}
+								className="tanstack-header-action-trigger"
+								onMouseDown={(event): void => {
+									event.stopPropagation();
+								}}
+							>
+								<MoreOutlined />
+							</span>
+						</PopoverTrigger>
+						<PopoverContent
+							align="end"
+							sideOffset={6}
+							className="tanstack-column-actions-content"
+						>
+							<button
+								type="button"
+								className="tanstack-remove-column-action"
+								onClick={(event): void => {
+									event.preventDefault();
+									event.stopPropagation();
+									onRemoveColumn?.(String(column.key));
+								}}
+							>
+								<CloseOutlined className="tanstack-remove-column-action-icon" />
+								Remove column
+							</button>
+						</PopoverContent>
+					</Popover>
+				)}
+			</span>
+			{isResizableColumn && (
+				<span
+					role="presentation"
+					className="cursor-col-resize"
+					title="Drag to resize column"
+					onClick={(event): void => {
+						event.preventDefault();
+						event.stopPropagation();
+					}}
+					onMouseDown={(event): void => {
+						handleResizeStart(event);
+					}}
+					onTouchStart={(event): void => {
+						handleResizeStart(event);
+					}}
+				>
+					<span className="tanstack-resize-handle-line" />
+				</span>
+			)}
+		</TableHeaderCellStyled>
+	);
+}
+
+export default TanStackHeaderRow;

frontend/src/container/LogsExplorerList/TanStackTableView/TanStackRow.tsx

@@ -0,0 +1,107 @@
+import {
+	MouseEvent as ReactMouseEvent,
+	MouseEventHandler,
+	useCallback,
+} from 'react';
+import { flexRender, Row as TanStackRowModel } from '@tanstack/react-table';
+import { VIEW_TYPES } from 'components/LogDetail/constants';
+import LogLinesActionButtons from 'components/Logs/LogLinesActionButtons/LogLinesActionButtons';
+
+import { TableCellStyled } from '../InfinityTableView/styles';
+import { InfinityTableProps } from '../InfinityTableView/types';
+import { TanStackTableRowData } from './types';
+
+type TanStackRowProps = {
+	row: TanStackRowModel<TanStackTableRowData>;
+	fontSize: InfinityTableProps['tableViewProps']['fontSize'];
+	onSetActiveLog?: InfinityTableProps['onSetActiveLog'];
+	onClearActiveLog?: InfinityTableProps['onClearActiveLog'];
+	isActiveLog?: boolean;
+	isDarkMode: boolean;
+	onLogCopy: (logId: string, event: ReactMouseEvent<HTMLElement>) => void;
+	isLogsExplorerPage: boolean;
+};
+
+function TanStackRow({
+	row,
+	fontSize,
+	onSetActiveLog,
+	onClearActiveLog,
+	isActiveLog = false,
+	isDarkMode,
+	onLogCopy,
+	isLogsExplorerPage,
+}: TanStackRowProps): JSX.Element {
+	const { currentLog } = row.original;
+
+	const handleShowContext: MouseEventHandler<HTMLElement> = useCallback(
+		(event) => {
+			event.preventDefault();
+			event.stopPropagation();
+			onSetActiveLog?.(currentLog, VIEW_TYPES.CONTEXT);
+		},
+		[currentLog, onSetActiveLog],
+	);
+
+	const handleShowLogDetails = useCallback(() => {
+		if (!currentLog) {
+			return;
+		}
+
+		if (isActiveLog && onClearActiveLog) {
+			onClearActiveLog();
+			return;
+		}
+
+		onSetActiveLog?.(currentLog);
+	}, [currentLog, isActiveLog, onClearActiveLog, onSetActiveLog]);
+
+	return (
+		<>
+			{row.getVisibleCells().map((cell) => {
+				const columnKey = cell.column.id;
+				return (
+					<TableCellStyled
+						$isDragColumn={false}
+						$isLogIndicator={columnKey === 'state-indicator'}
+						$hasSingleColumn={row.getVisibleCells().length <= 2}
+						$isDarkMode={isDarkMode}
+						key={cell.id}
+						fontSize={fontSize}
+						className={columnKey}
+						onClick={handleShowLogDetails}
+					>
+						{flexRender(cell.column.columnDef.cell, cell.getContext())}
+					</TableCellStyled>
+				);
+			})}
+			<TableCellStyled
+				$isDragColumn={false}
+				$isLogIndicator={false}
+				$hasSingleColumn={false}
+				$isDarkMode={isDarkMode}
+				fontSize={fontSize}
+				className="logs-table-filler-cell"
+				onClick={handleShowLogDetails}
+			/>
+			{isLogsExplorerPage && (
+				<TableCellStyled
+					$isDragColumn={false}
+					$isLogIndicator={false}
+					$hasSingleColumn={false}
+					$isDarkMode={isDarkMode}
+					fontSize={fontSize}
+					className="table-actions-cell"
+				>
+					<LogLinesActionButtons
+						handleShowContext={handleShowContext}
+						onLogCopy={(event): void => onLogCopy(currentLog.id, event)}
+						customClassName="table-view-log-actions"
+					/>
+				</TableCellStyled>
+			)}
+		</>
+	);
+}
+
+export default TanStackRow;

frontend/src/container/LogsExplorerList/TanStackTableView/TanStackTableView.styles.scss

@@ -0,0 +1,54 @@
+.tanstack-table-view-wrapper {
+	display: flex;
+	flex-direction: column;
+	width: 100%;
+	min-height: 0;
+}
+
+.tanstack-fixed-col {
+	width: 32px;
+	min-width: 32px;
+	max-width: 32px;
+}
+
+.tanstack-filler-col {
+	width: 100%;
+	min-width: 0;
+}
+
+.tanstack-actions-col {
+	width: 0;
+	min-width: 0;
+	max-width: 0;
+}
+
+.tanstack-load-more-container {
+	width: 100%;
+	min-height: 56px;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	padding: 8px 0 12px;
+	flex-shrink: 0;
+}
+.tanstack-table-virtuoso {
+	width: 100%;
+	overflow-x: scroll;
+}
+
+.tanstack-fontSize-small {
+	font-size: 11px;
+}
+
+.tanstack-fontSize-medium {
+	font-size: 13px;
+}
+
+.tanstack-fontSize-large {
+	font-size: 14px;
+}
+
+.tanstack-table-foot-loader-cell {
+	text-align: center;
+	padding: 8px 0;
+}

frontend/src/container/LogsExplorerList/TanStackTableView/__tests__/TanStackCustomTableRow.test.tsx

@@ -0,0 +1,98 @@
+import { render, screen } from '@testing-library/react';
+
+import TanStackCustomTableRow from '../TanStackCustomTableRow';
+import type { TanStackTableRowData } from '../types';
+
+jest.mock('../../InfinityTableView/styles', () => ({
+	TableRowStyled: 'tr',
+}));
+
+jest.mock('hooks/logs/useCopyLogLink', () => ({
+	useCopyLogLink: (): { isHighlighted: boolean } => ({ isHighlighted: false }),
+}));
+
+jest.mock('hooks/useDarkMode', () => ({
+	useIsDarkMode: (): boolean => false,
+}));
+
+jest.mock('components/Logs/LogStateIndicator/utils', () => ({
+	getLogIndicatorType: (): string => 'info',
+	getLogIndicatorTypeForTable: (): string => 'info',
+}));
+
+const item: TanStackTableRowData = {
+	log: {},
+	currentLog: { id: 'row-1' } as TanStackTableRowData['currentLog'],
+	rowIndex: 0,
+};
+
+/** Required by react-virtuoso `TableRow` / `TableComponents` typing */
+const virtuosoTableRowAttrs = {
+	'data-index': 0,
+	'data-item-index': 0,
+	'data-known-size': 40,
+} as const;
+
+describe('TanStackCustomTableRow', () => {
+	it('renders children inside TableRowStyled', () => {
+		render(
+			<table>
+				<tbody>
+					<TanStackCustomTableRow
+						{...virtuosoTableRowAttrs}
+						item={item}
+						logsById={new Map()}
+						activeLog={null}
+						activeContextLog={null}
+					>
+						<td>cell</td>
+					</TanStackCustomTableRow>
+				</tbody>
+			</table>,
+		);
+
+		expect(screen.getByText('cell')).toBeInTheDocument();
+	});
+
+	it('marks row active when activeLog matches item id', () => {
+		const { container } = render(
+			<table>
+				<tbody>
+					<TanStackCustomTableRow
+						{...virtuosoTableRowAttrs}
+						item={item}
+						logsById={new Map()}
+						activeLog={{ id: 'row-1' } as never}
+						activeContextLog={null}
+					>
+						<td>x</td>
+					</TanStackCustomTableRow>
+				</tbody>
+			</table>,
+		);
+
+		const row = container.querySelector('tr');
+		expect(row).toBeTruthy();
+	});
+
+	it('uses logsById entry when present for indicator type', () => {
+		const logFromMap = { id: 'row-1', severity_text: 'error' } as never;
+		render(
+			<table>
+				<tbody>
+					<TanStackCustomTableRow
+						{...virtuosoTableRowAttrs}
+						item={item}
+						logsById={new Map([['row-1', logFromMap]])}
+						activeLog={null}
+						activeContextLog={null}
+					>
+						<td>x</td>
+					</TanStackCustomTableRow>
+				</tbody>
+			</table>,
+		);
+
+		expect(screen.getByText('x')).toBeInTheDocument();
+	});
+});

frontend/src/container/LogsExplorerList/TanStackTableView/__tests__/TanStackHeaderRow.test.tsx

@@ -0,0 +1,152 @@
+import type { Header } from '@tanstack/react-table';
+import { render, screen } from '@testing-library/react';
+import { FontSize } from 'container/OptionsMenu/types';
+
+import TanStackHeaderRow from '../TanStackHeaderRow';
+import type { OrderedColumn, TanStackTableRowData } from '../types';
+
+jest.mock('../../InfinityTableView/styles', () => ({
+	TableHeaderCellStyled: 'th',
+}));
+
+const mockUseSortable = jest.fn((_args?: unknown) => ({
+	attributes: {},
+	listeners: {},
+	setNodeRef: jest.fn(),
+	setActivatorNodeRef: jest.fn(),
+	transform: null,
+	transition: undefined,
+	isDragging: false,
+}));
+
+jest.mock('@dnd-kit/sortable', () => ({
+	useSortable: (args: unknown): ReturnType<typeof mockUseSortable> =>
+		mockUseSortable(args),
+}));
+
+jest.mock('@tanstack/react-table', () => ({
+	flexRender: (def: unknown, ctx: unknown): unknown => {
+		if (typeof def === 'string') {
+			return def;
+		}
+		if (typeof def === 'function') {
+			return (def as (c: unknown) => unknown)(ctx);
+		}
+		return def;
+	},
+}));
+
+const column = (key: string): OrderedColumn =>
+	({ key, title: key } as OrderedColumn);
+
+const mockHeader = (
+	id: string,
+	canResize = true,
+): Header<TanStackTableRowData, unknown> =>
+	(({
+		id,
+		column: {
+			getCanResize: (): boolean => canResize,
+			getIsResizing: (): boolean => false,
+			columnDef: { header: id },
+		},
+		getContext: (): unknown => ({}),
+		getResizeHandler: (): (() => void) => jest.fn(),
+		flexRender: undefined,
+	} as unknown) as Header<TanStackTableRowData, unknown>);
+
+describe('TanStackHeaderRow', () => {
+	beforeEach(() => {
+		mockUseSortable.mockClear();
+	});
+
+	it('renders column title when header is undefined', () => {
+		render(
+			<table>
+				<thead>
+					<tr>
+						<TanStackHeaderRow
+							column={column('timestamp')}
+							isDarkMode={false}
+							fontSize={FontSize.SMALL}
+							hasSingleColumn={false}
+						/>
+					</tr>
+				</thead>
+			</table>,
+		);
+
+		expect(screen.getByText('Timestamp')).toBeInTheDocument();
+	});
+
+	it('enables useSortable for draggable columns', () => {
+		render(
+			<table>
+				<thead>
+					<tr>
+						<TanStackHeaderRow
+							column={column('body')}
+							header={mockHeader('body')}
+							isDarkMode={false}
+							fontSize={FontSize.SMALL}
+							hasSingleColumn={false}
+						/>
+					</tr>
+				</thead>
+			</table>,
+		);
+
+		expect(mockUseSortable).toHaveBeenCalledWith(
+			expect.objectContaining({
+				id: 'body',
+				disabled: false,
+			}),
+		);
+	});
+
+	it('disables sortable for expand column', () => {
+		render(
+			<table>
+				<thead>
+					<tr>
+						<TanStackHeaderRow
+							column={column('expand')}
+							header={mockHeader('expand', false)}
+							isDarkMode={false}
+							fontSize={FontSize.SMALL}
+							hasSingleColumn={false}
+						/>
+					</tr>
+				</thead>
+			</table>,
+		);
+
+		expect(mockUseSortable).toHaveBeenCalledWith(
+			expect.objectContaining({
+				disabled: true,
+			}),
+		);
+	});
+
+	it('shows drag grip for draggable columns', () => {
+		render(
+			<table>
+				<thead>
+					<tr>
+						<TanStackHeaderRow
+							column={column('body')}
+							header={mockHeader('body')}
+							isDarkMode={false}
+							fontSize={FontSize.SMALL}
+							hasSingleColumn={false}
+						/>
+					</tr>
+				</thead>
+			</table>,
+		);
+
+		expect(
+			screen.getByRole('button', { name: /Drag body column/i }),
+		).toBeInTheDocument();
+	});
+});

frontend/src/container/LogsExplorerList/TanStackTableView/__tests__/TanStackRow.test.tsx

@@ -0,0 +1,220 @@
+import { fireEvent, render, screen } from '@testing-library/react';
+import { FontSize } from 'container/OptionsMenu/types';
+
+import TanStackRow from '../TanStackRow';
+import type { TanStackTableRowData } from '../types';
+
+jest.mock('../../InfinityTableView/styles', () => ({
+	TableCellStyled: 'td',
+}));
+
+jest.mock(
+	'components/Logs/LogLinesActionButtons/LogLinesActionButtons',
+	() => ({
+		__esModule: true,
+		default: ({
+			onLogCopy,
+		}: {
+			onLogCopy: (e: React.MouseEvent) => void;
+		}): JSX.Element => (
+			<button type="button" data-testid="copy-btn" onClick={onLogCopy}>
+				copy
+			</button>
+		),
+	}),
+);
+
+const flexRenderMock = jest.fn((def: unknown, _ctx?: unknown) =>
+	typeof def === 'function' ? def({}) : def,
+);
+
+jest.mock('@tanstack/react-table', () => ({
+	flexRender: (def: unknown, ctx: unknown): unknown => flexRenderMock(def, ctx),
+}));
+
+function buildMockRow(
+	visibleCells: Array<{ columnId: string }>,
+): Parameters<typeof TanStackRow>[0]['row'] {
+	return {
+		original: {
+			currentLog: { id: 'log-1' } as TanStackTableRowData['currentLog'],
+			log: {},
+			rowIndex: 0,
+		},
+		getVisibleCells: () =>
+			visibleCells.map((cell, index) => ({
+				id: `cell-${index}`,
+				column: {
+					id: cell.columnId,
+					columnDef: {
+						cell: (): string => `content-${cell.columnId}`,
+					},
+				},
+				getContext: (): Record<string, unknown> => ({}),
+			})),
+	} as never;
+}
+
+describe('TanStackRow', () => {
+	beforeEach(() => {
+		flexRenderMock.mockClear();
+	});
+
+	it('renders a cell per visible column and calls flexRender', () => {
+		const row = buildMockRow([
+			{ columnId: 'state-indicator' },
+			{ columnId: 'body' },
+		]);
+
+		render(
+			<table>
+				<tbody>
+					<tr>
+						<TanStackRow
+							row={row}
+							fontSize={FontSize.SMALL}
+							isDarkMode={false}
+							onLogCopy={jest.fn()}
+							isLogsExplorerPage={false}
+						/>
+					</tr>
+				</tbody>
+			</table>,
+		);
+
+		expect(screen.getAllByRole('cell')).toHaveLength(3);
+		expect(flexRenderMock).toHaveBeenCalled();
+	});
+
+	it('applies state-indicator styling class on the indicator cell', () => {
+		const row = buildMockRow([{ columnId: 'state-indicator' }]);
+
+		const { container } = render(
+			<table>
+				<tbody>
+					<tr>
+						<TanStackRow
+							row={row}
+							fontSize={FontSize.SMALL}
+							isDarkMode={false}
+							onLogCopy={jest.fn()}
+							isLogsExplorerPage={false}
+						/>
+					</tr>
+				</tbody>
+			</table>,
+		);
+
+		expect(container.querySelector('td.state-indicator')).toBeInTheDocument();
+	});
+
+	it('renders row actions on logs explorer page', () => {
+		const row = buildMockRow([{ columnId: 'body' }]);
+
+		render(
+			<table>
+				<tbody>
+					<tr>
+						<TanStackRow
+							row={row}
+							fontSize={FontSize.SMALL}
+							isDarkMode={false}
+							onLogCopy={jest.fn()}
+							isLogsExplorerPage
+						/>
+					</tr>
+				</tbody>
+			</table>,
+		);
+
+		expect(screen.getByTestId('copy-btn')).toBeInTheDocument();
+	});
+
+	it('click on a data cell calls onSetActiveLog with current log', () => {
+		const onSetActiveLog = jest.fn();
+		const row = buildMockRow([{ columnId: 'body' }]);
+
+		render(
+			<table>
+				<tbody>
+					<tr>
+						<TanStackRow
+							row={row}
+							fontSize={FontSize.SMALL}
+							isDarkMode={false}
+							onSetActiveLog={onSetActiveLog}
+							onLogCopy={jest.fn()}
+							isLogsExplorerPage={false}
+						/>
+					</tr>
+				</tbody>
+			</table>,
+		);
+
+		fireEvent.click(screen.getAllByRole('cell')[0]);
+
+		expect(onSetActiveLog).toHaveBeenCalledWith(
+			expect.objectContaining({ id: 'log-1' }),
+		);
+	});
+
+	it('click on filler cell calls onSetActiveLog', () => {
+		const onSetActiveLog = jest.fn();
+		const row = buildMockRow([{ columnId: 'body' }]);
+
+		const { container } = render(
+			<table>
+				<tbody>
+					<tr>
+						<TanStackRow
+							row={row}
+							fontSize={FontSize.SMALL}
+							isDarkMode={false}
+							onSetActiveLog={onSetActiveLog}
+							onLogCopy={jest.fn()}
+							isLogsExplorerPage={false}
+						/>
+					</tr>
+				</tbody>
+			</table>,
+		);
+
+		const filler = container.querySelector('td.logs-table-filler-cell');
+		expect(filler).toBeTruthy();
+		fireEvent.click(filler!);
+
+		expect(onSetActiveLog).toHaveBeenCalledWith(
+			expect.objectContaining({ id: 'log-1' }),
+		);
+	});
+
+	it('when row is active log, click on cell clears active log', () => {
+		const onSetActiveLog = jest.fn();
+		const onClearActiveLog = jest.fn();
+		const row = buildMockRow([{ columnId: 'body' }]);
+
+		render(
+			<table>
+				<tbody>
+					<tr>
+						<TanStackRow
+							row={row}
+							fontSize={FontSize.SMALL}
+							isDarkMode={false}
+							isActiveLog
+							onSetActiveLog={onSetActiveLog}
+							onClearActiveLog={onClearActiveLog}
+							onLogCopy={jest.fn()}
+							isLogsExplorerPage={false}
+						/>
+					</tr>
+				</tbody>
+			</table>,
+		);
+
+		fireEvent.click(screen.getAllByRole('cell')[0]);
+
+		expect(onClearActiveLog).toHaveBeenCalled();
+		expect(onSetActiveLog).not.toHaveBeenCalled();
+	});
+});

frontend/src/container/LogsExplorerList/TanStackTableView/__tests__/TanStackTableView.test.tsx

@@ -0,0 +1,104 @@
+import { forwardRef } from 'react';
+import { render, screen } from '@testing-library/react';
+import { FontSize } from 'container/OptionsMenu/types';
+
+import type { InfinityTableProps } from '../../InfinityTableView/types';
+import TanStackTableView from '../index';
+
+jest.mock('react-virtuoso', () => ({
+	TableVirtuoso: forwardRef<
+		unknown,
+		{
+			fixedHeaderContent?: () => JSX.Element;
+			itemContent: (i: number) => JSX.Element;
+		}
+	>(function MockVirtuoso({ fixedHeaderContent, itemContent }, _ref) {
+		return (
+			<div data-testid="virtuoso">
+				{fixedHeaderContent?.()}
+				{itemContent(0)}
+			</div>
+		);
+	}),
+}));
+
+jest.mock('components/Logs/TableView/useTableView', () => ({
+	useTableView: (): {
+		dataSource: Record<string, string>[];
+		columns: unknown[];
+	} => ({
+		dataSource: [{ id: '1' }],
+		columns: [
+			{ key: 'body', title: 'body', render: (): string => 'x' },
+			{ key: 'state-indicator', title: 's', render: (): string => 'y' },
+		],
+	}),
+}));
+
+jest.mock('hooks/useDragColumns', () => ({
+	__esModule: true,
+	default: (): {
+		draggedColumns: unknown[];
+		onColumnOrderChange: () => void;
+	} => ({
+		draggedColumns: [],
+		onColumnOrderChange: jest.fn(),
+	}),
+}));
+
+jest.mock('hooks/logs/useActiveLog', () => ({
+	useActiveLog: (): { activeLog: null } => ({ activeLog: null }),
+}));
+
+jest.mock('hooks/logs/useCopyLogLink', () => ({
+	useCopyLogLink: (): { activeLogId: null } => ({ activeLogId: null }),
+}));
+
+jest.mock('hooks/useDarkMode', () => ({
+	useIsDarkMode: (): boolean => false,
+}));
+
+jest.mock('react-router-dom', () => ({
+	useLocation: (): { pathname: string } => ({ pathname: '/logs' }),
+}));
+
+jest.mock('react-use', () => ({
+	useCopyToClipboard: (): [unknown, () => void] => [null, jest.fn()],
+}));
+
+jest.mock('@signozhq/sonner', () => ({
+	toast: { success: jest.fn() },
+}));
+
+jest.mock('components/Spinner', () => ({
+	__esModule: true,
+	default: ({ tip }: { tip: string }): JSX.Element => (
+		<div data-testid="spinner">{tip}</div>
+	),
+}));
+
+const baseProps: InfinityTableProps = {
+	isLoading: false,
+	tableViewProps: {
+		logs: [{ id: '1' } as never],
+		fields: [],
+		linesPerRow: 3,
+		fontSize: FontSize.SMALL,
+		appendTo: 'end',
+		activeLogIndex: 0,
+	},
+};
+
+describe('TanStackTableView', () => {
+	it('shows spinner while loading', () => {
+		render(<TanStackTableView {...baseProps} isLoading />);
+
+		expect(screen.getByTestId('spinner')).toHaveTextContent('Getting Logs');
+	});
+
+	it('renders virtuoso when not loading', () => {
+		render(<TanStackTableView {...baseProps} />);
+
+		expect(screen.getByTestId('virtuoso')).toBeInTheDocument();
+	});
+});

frontend/src/container/LogsExplorerList/TanStackTableView/__tests__/useColumnSizingPersistence.test.tsx

@@ -0,0 +1,173 @@
+import { act, renderHook } from '@testing-library/react';
+import { LOCALSTORAGE } from 'constants/localStorage';
+
+import type { OrderedColumn } from '../types';
+import { useColumnSizingPersistence } from '../useColumnSizingPersistence';
+
+const mockGet = jest.fn();
+const mockSet = jest.fn();
+
+jest.mock('api/browser/localstorage/get', () => ({
+	__esModule: true,
+	default: (key: string): string | null => mockGet(key),
+}));
+
+jest.mock('api/browser/localstorage/set', () => ({
+	__esModule: true,
+	default: (key: string, value: string): void => {
+		mockSet(key, value);
+	},
+}));
+
+const col = (key: string): OrderedColumn =>
+	({ key, title: key } as OrderedColumn);
+
+describe('useColumnSizingPersistence', () => {
+	beforeEach(() => {
+		jest.clearAllMocks();
+		mockGet.mockReturnValue(null);
+		jest.useFakeTimers();
+	});
+
+	afterEach(() => {
+		jest.runOnlyPendingTimers();
+		jest.useRealTimers();
+	});
+
+	it('initializes with empty sizing when localStorage is empty', () => {
+		const { result } = renderHook(() =>
+			useColumnSizingPersistence([col('body'), col('timestamp')]),
+		);
+
+		expect(result.current.columnSizing).toEqual({});
+	});
+
+	it('parses flat ColumnSizingState from localStorage', () => {
+		mockGet.mockReturnValue(JSON.stringify({ body: 400, timestamp: 180 }));
+
+		const { result } = renderHook(() =>
+			useColumnSizingPersistence([col('body'), col('timestamp')]),
+		);
+
+		expect(result.current.columnSizing).toEqual({ body: 400, timestamp: 180 });
+	});
+
+	it('parses PersistedColumnSizing wrapper with sizing + columnIdsSignature', () => {
+		mockGet.mockReturnValue(
+			JSON.stringify({
+				version: 1,
+				columnIdsSignature: 'body|timestamp',
+				sizing: { body: 300 },
+			}),
+		);
+
+		const { result } = renderHook(() =>
+			useColumnSizingPersistence([col('body'), col('timestamp')]),
+		);
+
+		expect(result.current.columnSizing).toEqual({ body: 300 });
+	});
+
+	it('drops invalid numeric entries when reading from localStorage', () => {
+		mockGet.mockReturnValue(
+			JSON.stringify({
+				body: 200,
+				bad: NaN,
+				zero: 0,
+				neg: -1,
+				str: 'wide',
+			}),
+		);
+
+		const { result } = renderHook(() =>
+			useColumnSizingPersistence([col('body'), col('bad'), col('zero')]),
+		);
+
+		expect(result.current.columnSizing).toEqual({ body: 200 });
+	});
+
+	it('returns empty sizing when JSON is invalid', () => {
+		const spy = jest.spyOn(console, 'error').mockImplementation(() => {});
+		mockGet.mockReturnValue('not-json');
+
+		const { result } = renderHook(() =>
+			useColumnSizingPersistence([col('body')]),
+		);
+
+		expect(result.current.columnSizing).toEqual({});
+		spy.mockRestore();
+	});
+
+	it('prunes sizing for columns not in orderedColumns and strips fixed columns', () => {
+		mockGet.mockReturnValue(JSON.stringify({ body: 400, expand: 32, gone: 100 }));
+
+		const { result, rerender } = renderHook(
+			({ columns }: { columns: OrderedColumn[] }) =>
+				useColumnSizingPersistence(columns),
+			{
+				initialProps: {
+					columns: [
+						col('body'),
+						col('expand'),
+						col('state-indicator'),
+					] as OrderedColumn[],
+				},
+			},
+		);
+
+		expect(result.current.columnSizing).toEqual({ body: 400 });
+
+		act(() => {
+			rerender({
+				columns: [col('body'), col('expand'), col('state-indicator')],
+			});
+		});
+
+		expect(result.current.columnSizing).toEqual({ body: 400 });
+	});
+
+	it('updates setColumnSizing manually', () => {
+		const { result } = renderHook(() =>
+			useColumnSizingPersistence([col('body')]),
+		);
+
+		act(() => {
+			result.current.setColumnSizing({ body: 500 });
+		});
+
+		expect(result.current.columnSizing).toEqual({ body: 500 });
+	});
+
+	it('debounces writes to localStorage', () => {
+		const { result } = renderHook(() =>
+			useColumnSizingPersistence([col('body')]),
+		);
+
+		act(() => {
+			result.current.setColumnSizing({ body: 600 });
+		});
+
+		expect(mockSet).not.toHaveBeenCalled();
+
+		act(() => {
+			jest.advanceTimersByTime(250);
+		});
+
+		expect(mockSet).toHaveBeenCalledWith(
+			LOCALSTORAGE.LOGS_LIST_COLUMN_SIZING,
+			expect.stringContaining('"body":600'),
+		);
+	});
+
+	it('does not persist when ordered columns signature effect runs with empty ids early — still debounces empty sizing', () => {
+		const { result } = renderHook(() => useColumnSizingPersistence([]));
+
+		expect(result.current.columnSizing).toEqual({});
+
+		act(() => {
+			jest.advanceTimersByTime(250);
+		});
+
+		expect(mockSet).toHaveBeenCalled();
+	});
+});

frontend/src/container/LogsExplorerList/TanStackTableView/__tests__/useOrderedColumns.test.tsx

@@ -0,0 +1,190 @@
+import { act, renderHook } from '@testing-library/react';
+
+import type { OrderedColumn } from '../types';
+import { useOrderedColumns } from '../useOrderedColumns';
+
+const mockGetDraggedColumns = jest.fn();
+
+jest.mock('hooks/useDragColumns/utils', () => ({
+	getDraggedColumns: <T,>(current: unknown[], dragged: unknown[]): T[] =>
+		mockGetDraggedColumns(current, dragged) as T[],
+}));
+
+const col = (key: string, title?: string): OrderedColumn =>
+	({ key, title: title ?? key } as OrderedColumn);
+
+describe('useOrderedColumns', () => {
+	beforeEach(() => {
+		jest.clearAllMocks();
+	});
+
+	it('returns columns from getDraggedColumns filtered to keys with string or number', () => {
+		mockGetDraggedColumns.mockReturnValue([
+			col('body'),
+			col('timestamp'),
+			{ title: 'no-key' },
+		]);
+
+		const { result } = renderHook(() =>
+			useOrderedColumns({
+				columns: [],
+				draggedColumns: [],
+				onColumnOrderChange: jest.fn(),
+			}),
+		);
+
+		expect(result.current.orderedColumns).toEqual([
+			col('body'),
+			col('timestamp'),
+		]);
+		expect(result.current.orderedColumnIds).toEqual(['body', 'timestamp']);
+	});
+
+	it('hasSingleColumn is true when exactly one column is not state-indicator', () => {
+		mockGetDraggedColumns.mockReturnValue([col('state-indicator'), col('body')]);
+
+		const { result } = renderHook(() =>
+			useOrderedColumns({
+				columns: [],
+				draggedColumns: [],
+				onColumnOrderChange: jest.fn(),
+			}),
+		);
+
+		expect(result.current.hasSingleColumn).toBe(true);
+	});
+
+	it('hasSingleColumn is false when more than one non-state-indicator column exists', () => {
+		mockGetDraggedColumns.mockReturnValue([
+			col('state-indicator'),
+			col('body'),
+			col('timestamp'),
+		]);
+
+		const { result } = renderHook(() =>
+			useOrderedColumns({
+				columns: [],
+				draggedColumns: [],
+				onColumnOrderChange: jest.fn(),
+			}),
+		);
+
+		expect(result.current.hasSingleColumn).toBe(false);
+	});
+
+	it('handleDragEnd reorders columns and calls onColumnOrderChange', () => {
+		const onColumnOrderChange = jest.fn();
+		mockGetDraggedColumns.mockReturnValue([col('a'), col('b'), col('c')]);
+
+		const { result } = renderHook(() =>
+			useOrderedColumns({
+				columns: [],
+				draggedColumns: [],
+				onColumnOrderChange,
+			}),
+		);
+
+		act(() => {
+			result.current.handleDragEnd({
+				active: { id: 'a' },
+				over: { id: 'c' },
+			} as never);
+		});
+
+		expect(result.current.orderedColumns.map((c) => c.key)).toEqual([
+			'b',
+			'c',
+			'a',
+		]);
+		expect(onColumnOrderChange).toHaveBeenCalledWith(
+			expect.arrayContaining([
+				expect.objectContaining({ key: 'b' }),
+				expect.objectContaining({ key: 'c' }),
+				expect.objectContaining({ key: 'a' }),
+			]),
+		);
+	});
+
+	it('handleDragEnd no-ops when over is null', () => {
+		const onColumnOrderChange = jest.fn();
+		mockGetDraggedColumns.mockReturnValue([col('a'), col('b')]);
+
+		const { result } = renderHook(() =>
+			useOrderedColumns({
+				columns: [],
+				draggedColumns: [],
+				onColumnOrderChange,
+			}),
+		);
+
+		const before = result.current.orderedColumns;
+
+		act(() => {
+			result.current.handleDragEnd({
+				active: { id: 'a' },
+				over: null,
+			} as never);
+		});
+
+		expect(result.current.orderedColumns).toBe(before);
+		expect(onColumnOrderChange).not.toHaveBeenCalled();
+	});
+
+	it('handleDragEnd no-ops when active.id equals over.id', () => {
+		const onColumnOrderChange = jest.fn();
+		mockGetDraggedColumns.mockReturnValue([col('a'), col('b')]);
+
+		const { result } = renderHook(() =>
+			useOrderedColumns({
+				columns: [],
+				draggedColumns: [],
+				onColumnOrderChange,
+			}),
+		);
+
+		act(() => {
+			result.current.handleDragEnd({
+				active: { id: 'a' },
+				over: { id: 'a' },
+			} as never);
+		});
+
+		expect(onColumnOrderChange).not.toHaveBeenCalled();
+	});
+
+	it('handleDragEnd no-ops when indices cannot be resolved', () => {
+		const onColumnOrderChange = jest.fn();
+		mockGetDraggedColumns.mockReturnValue([col('a'), col('b')]);
+
+		const { result } = renderHook(() =>
+			useOrderedColumns({
+				columns: [],
+				draggedColumns: [],
+				onColumnOrderChange,
+			}),
+		);
+
+		act(() => {
+			result.current.handleDragEnd({
+				active: { id: 'missing' },
+				over: { id: 'a' },
+			} as never);
+		});
+
+		expect(onColumnOrderChange).not.toHaveBeenCalled();
+	});
+
+	it('exposes sensors from useSensors', () => {
+		mockGetDraggedColumns.mockReturnValue([col('a')]);
+
+		const { result } = renderHook(() =>
+			useOrderedColumns({
+				columns: [],
+				draggedColumns: [],
+				onColumnOrderChange: jest.fn(),
+			}),
+		);
+
+		expect(result.current.sensors).toBeDefined();
+	});
+});

frontend/src/container/LogsExplorerList/TanStackTableView/index.tsx

@@ -0,0 +1,483 @@
+import {
+	forwardRef,
+	memo,
+	MouseEvent as ReactMouseEvent,
+	ReactElement,
+	useCallback,
+	useEffect,
+	useImperativeHandle,
+	useMemo,
+	useRef,
+	useState,
+} from 'react';
+import { useLocation } from 'react-router-dom';
+import { useCopyToClipboard } from 'react-use';
+import {
+	TableComponents,
+	TableVirtuoso,
+	TableVirtuosoHandle,
+} from 'react-virtuoso';
+import { DndContext, pointerWithin } from '@dnd-kit/core';
+import {
+	horizontalListSortingStrategy,
+	SortableContext,
+} from '@dnd-kit/sortable';
+import { toast } from '@signozhq/sonner';
+import {
+	ColumnDef,
+	getCoreRowModel,
+	useReactTable,
+} from '@tanstack/react-table';
+import { VIEW_TYPES } from 'components/LogDetail/constants';
+import { ColumnTypeRender } from 'components/Logs/TableView/types';
+import { useTableView } from 'components/Logs/TableView/useTableView';
+import Spinner from 'components/Spinner';
+import { LOCALSTORAGE } from 'constants/localStorage';
+import { QueryParams } from 'constants/query';
+import ROUTES from 'constants/routes';
+import { useActiveLog } from 'hooks/logs/useActiveLog';
+import { useCopyLogLink } from 'hooks/logs/useCopyLogLink';
+import { useIsDarkMode } from 'hooks/useDarkMode';
+import useDragColumns from 'hooks/useDragColumns';
+
+import { getInfinityDefaultStyles } from '../InfinityTableView/config';
+import {
+	TableHeaderCellStyled,
+	TanStackTableStyled,
+} from '../InfinityTableView/styles';
+import { InfinityTableProps } from '../InfinityTableView/types';
+import TanStackCustomTableRow from './TanStackCustomTableRow';
+import TanStackHeaderRow from './TanStackHeaderRow';
+import TanStackRow from './TanStackRow';
+import { TableRecord, TanStackTableRowData } from './types';
+import { useColumnSizingPersistence } from './useColumnSizingPersistence';
+import { useOrderedColumns } from './useOrderedColumns';
+import {
+	getColumnId,
+	getColumnMinWidthPx,
+	resolveColumnTypeRender,
+} from './utils';
+
+import '../logsTableVirtuosoScrollbar.scss';
+import './TanStackTableView.styles.scss';
+
+const COLUMN_DND_AUTO_SCROLL = {
+	layoutShiftCompensation: false as const,
+	threshold: { x: 0.2, y: 0 },
+};
+
+const TanStackTableView = forwardRef<TableVirtuosoHandle, InfinityTableProps>(
+	function TanStackTableView(
+		{
+			isLoading,
+			isFetching,
+			onRemoveColumn,
+			removableColumnKeys,
+			tableViewProps,
+			infitiyTableProps,
+			onSetActiveLog,
+			onClearActiveLog,
+			activeLog,
+		}: InfinityTableProps,
+		forwardedRef,
+	): JSX.Element {
+		const { pathname } = useLocation();
+		const virtuosoRef = useRef<TableVirtuosoHandle | null>(null);
+		useImperativeHandle(
+			forwardedRef,
+			() => virtuosoRef.current as TableVirtuosoHandle,
+			[],
+		);
+		const [, setCopy] = useCopyToClipboard();
+		const { dataSource, columns } = useTableView({
+			...tableViewProps,
+			onClickExpand: onSetActiveLog,
+			onOpenLogsContext: (log): void => onSetActiveLog?.(log, VIEW_TYPES.CONTEXT),
+		});
+
+		const { draggedColumns, onColumnOrderChange } = useDragColumns<TableRecord>(
+			LOCALSTORAGE.LOGS_LIST_COLUMNS,
+		);
+		const {
+			orderedColumns,
+			orderedColumnIds,
+			hasSingleColumn,
+			handleDragEnd,
+			sensors,
+		} = useOrderedColumns({
+			columns,
+			draggedColumns,
+			onColumnOrderChange: onColumnOrderChange as (columns: unknown[]) => void,
+		});
+		const { columnSizing, setColumnSizing } = useColumnSizingPersistence(
+			orderedColumns,
+		);
+		const removableColumnKeySet = useMemo(
+			() => new Set((removableColumnKeys || []).map((column) => String(column))),
+			[removableColumnKeys],
+		);
+		const isAtMinimumRemovableColumns = useMemo(
+			() =>
+				orderedColumns.filter(
+					(column) => column.key !== 'state-indicator' && column.key !== 'expand',
+				).length <= 1,
+			[orderedColumns],
+		);
+		const tableData = useMemo<TanStackTableRowData[]>(
+			() =>
+				dataSource
+					.map((log, rowIndex) => {
+						const currentLog = tableViewProps.logs[rowIndex];
+						if (!currentLog) {
+							return null;
+						}
+						return { log, currentLog, rowIndex };
+					})
+					.filter(Boolean) as TanStackTableRowData[],
+			[dataSource, tableViewProps.logs],
+		);
+		const tanstackColumns = useMemo<ColumnDef<TanStackTableRowData>[]>(
+			() =>
+				orderedColumns.map((column) => {
+					const isStateIndicator = column.key === 'state-indicator';
+					const isExpand = column.key === 'expand';
+					const isFixedColumn = isStateIndicator || isExpand;
+					const fixedWidth = isFixedColumn ? 32 : undefined;
+					const minWidthPx = getColumnMinWidthPx(column, orderedColumns);
+					const headerTitle = String(column.title || '');
+
+					return {
+						id: getColumnId(column),
+						header: headerTitle.replace(/^\w/, (character) =>
+							character.toUpperCase(),
+						),
+						accessorFn: (row): unknown => row.log[column.key as keyof TableRecord],
+						enableResizing: !isFixedColumn,
+						minSize: fixedWidth ?? minWidthPx,
+						size: fixedWidth,
+						maxSize: fixedWidth,
+						cell: ({ row, getValue }): ReactElement | string | number | null => {
+							if (!column.render) {
+								return null;
+							}
+
+							return resolveColumnTypeRender(
+								column.render(
+									getValue(),
+									row.original.log,
+									row.original.rowIndex,
+								) as ColumnTypeRender<Record<string, unknown>>,
+							);
+						},
+					};
+				}),
+			[orderedColumns],
+		);
+		const { activeLogId } = useCopyLogLink();
+		const { activeLog: activeContextLog } = useActiveLog();
+		const rowSelection = useMemo<Record<string, boolean>>(() => {
+			const targetId = activeLog?.id ?? activeLogId;
+			if (targetId === undefined || targetId === null || targetId === '') {
+				return {};
+			}
+
+			const activeIndex = tableData.findIndex(
+				(row) => String(row.currentLog.id) === String(targetId),
+			);
+			if (activeIndex < 0) {
+				return {};
+			}
+
+			return { [String(activeIndex)]: true };
+		}, [activeLog?.id, activeLogId, tableData]);
+		const table = useReactTable({
+			data: tableData,
+			columns: tanstackColumns,
+			enableColumnResizing: true,
+			getCoreRowModel: getCoreRowModel(),
+			columnResizeMode: 'onChange',
+			onColumnSizingChange: setColumnSizing,
+			state: {
+				rowSelection,
+				columnSizing,
+			},
+		});
+		const tableRows = table.getRowModel().rows;
+		const [loadMoreState, setLoadMoreState] = useState<{
+			active: boolean;
+			seenFetching: boolean;
+			startCount: number;
+		}>({
+			active: false,
+			seenFetching: false,
+			startCount: 0,
+		});
+
+		const isLogsExplorerPage = pathname === ROUTES.LOGS_EXPLORER;
+		const logsById = useMemo(
+			() => new Map(tableViewProps.logs.map((log) => [String(log.id), log])),
+			[tableViewProps.logs],
+		);
+		useEffect(() => {
+			const activeLogIndex = tableViewProps.activeLogIndex ?? -1;
+			if (activeLogIndex < 0 || activeLogIndex >= tableRows.length) {
+				return;
+			}
+
+			virtuosoRef.current?.scrollToIndex({
+				index: activeLogIndex,
+				align: 'center',
+				behavior: 'auto',
+			});
+		}, [tableRows.length, tableViewProps.activeLogIndex]);
+
+		useEffect(() => {
+			if (!loadMoreState.active) {
+				return;
+			}
+
+			if (isFetching && !loadMoreState.seenFetching) {
+				setLoadMoreState((prev) =>
+					prev.active && !prev.seenFetching ? { ...prev, seenFetching: true } : prev,
+				);
+				return;
+			}
+
+			if (
+				(loadMoreState.seenFetching && !isFetching) ||
+				tableRows.length > loadMoreState.startCount
+			) {
+				setLoadMoreState((prev) =>
+					prev.active
+						? { active: false, seenFetching: false, startCount: prev.startCount }
+						: prev,
+				);
+			}
+		}, [isFetching, loadMoreState, tableRows.length]);
+		const isDarkMode = useIsDarkMode();
+		const handleLogCopy = useCallback(
+			(logId: string, event: ReactMouseEvent<HTMLElement>): void => {
+				event.preventDefault();
+				event.stopPropagation();
+
+				const urlQuery = new URLSearchParams(window.location.search);
+				urlQuery.delete(QueryParams.activeLogId);
+				urlQuery.delete(QueryParams.relativeTime);
+				urlQuery.set(QueryParams.activeLogId, `"${logId}"`);
+				const link = `${window.location.origin}${pathname}?${urlQuery.toString()}`;
+
+				setCopy(link);
+				toast.success('Copied to clipboard', { position: 'top-right' });
+			},
+			[pathname, setCopy],
+		);
+		const customTableRow = useCallback<
+			NonNullable<TableComponents<TanStackTableRowData>['TableRow']>
+		>(
+			({ children, item, ...props }) => (
+				<TanStackCustomTableRow
+					{...props}
+					item={item}
+					activeLog={activeLog}
+					activeContextLog={activeContextLog}
+					logsById={logsById}
+				>
+					{children}
+				</TanStackCustomTableRow>
+			),
+			[activeContextLog, activeLog, logsById],
+		);
+		const itemContent = useCallback(
+			(index: number): JSX.Element | null => {
+				const row = table.getRowModel().rows[index];
+				if (!row) {
+					return null;
+				}
+
+				return (
+					<TanStackRow
+						row={row}
+						fontSize={tableViewProps.fontSize}
+						onSetActiveLog={onSetActiveLog}
+						onClearActiveLog={onClearActiveLog}
+						isActiveLog={
+							String(activeLog?.id ?? '') === String(row.original.currentLog.id ?? '')
+						}
+						isDarkMode={isDarkMode}
+						onLogCopy={handleLogCopy}
+						isLogsExplorerPage={isLogsExplorerPage}
+					/>
+				);
+			},
+			[
+				activeLog?.id,
+				handleLogCopy,
+				isDarkMode,
+				isLogsExplorerPage,
+				onClearActiveLog,
+				onSetActiveLog,
+				table,
+				tableViewProps.fontSize,
+			],
+		);
+		const tableHeader = useCallback(() => {
+			const flatHeaders = table
+				.getFlatHeaders()
+				.filter((header) => !header.isPlaceholder);
+			const orderedColumnsById = new Map(
+				orderedColumns.map((column) => [getColumnId(column), column] as const),
+			);
+
+			return (
+				<DndContext
+					sensors={sensors}
+					collisionDetection={pointerWithin}
+					onDragEnd={handleDragEnd}
+					autoScroll={COLUMN_DND_AUTO_SCROLL}
+				>
+					<SortableContext
+						items={orderedColumnIds}
+						strategy={horizontalListSortingStrategy}
+					>
+						<tr>
+							{flatHeaders.map((header) => {
+								const column = orderedColumnsById.get(header.id);
+								if (!column) {
+									return null;
+								}
+
+								return (
+									<TanStackHeaderRow
+										key={header.id}
+										column={column}
+										header={header}
+										isDarkMode={isDarkMode}
+										fontSize={tableViewProps.fontSize}
+										hasSingleColumn={hasSingleColumn}
+										onRemoveColumn={onRemoveColumn}
+										canRemoveColumn={
+											!isAtMinimumRemovableColumns &&
+											removableColumnKeySet.has(String(column.key ?? ''))
+										}
+									/>
+								);
+							})}
+							<TableHeaderCellStyled
+								aria-hidden
+								$isDragColumn={false}
+								$isDarkMode={isDarkMode}
+								fontSize={tableViewProps.fontSize}
+								className="logs-table-filler-header"
+							/>
+							{isLogsExplorerPage && (
+								<TableHeaderCellStyled
+									aria-hidden
+									$isDragColumn={false}
+									$isDarkMode={isDarkMode}
+									fontSize={tableViewProps.fontSize}
+									className="logs-table-actions-header"
+								/>
+							)}
+						</tr>
+					</SortableContext>
+				</DndContext>
+			);
+		}, [
+			handleDragEnd,
+			hasSingleColumn,
+			isDarkMode,
+			orderedColumnIds,
+			orderedColumns,
+			onRemoveColumn,
+			isAtMinimumRemovableColumns,
+			removableColumnKeySet,
+			sensors,
+			table,
+			tableViewProps.fontSize,
+			isLogsExplorerPage,
+		]);
+
+		const handleEndReached = useCallback(
+			(index: number): void => {
+				if (!infitiyTableProps?.onEndReached) {
+					return;
+				}
+
+				setLoadMoreState({
+					active: true,
+					seenFetching: Boolean(isFetching),
+					startCount: tableRows.length,
+				});
+				infitiyTableProps.onEndReached(index);
+			},
+			[infitiyTableProps, isFetching, tableRows.length],
+		);
+
+		if (isLoading) {
+			return <Spinner height="35px" tip="Getting Logs" />;
+		}
+
+		return (
+			<div className="tanstack-table-view-wrapper">
+				<TableVirtuoso
+					className="logs-table-virtuoso-scroll"
+					ref={virtuosoRef}
+					style={getInfinityDefaultStyles(tableViewProps.fontSize)}
+					data={tableData}
+					totalCount={tableRows.length}
+					initialTopMostItemIndex={
+						tableViewProps.activeLogIndex !== -1 ? tableViewProps.activeLogIndex : 0
+					}
+					fixedHeaderContent={tableHeader}
+					itemContent={itemContent}
+					components={{
+						Table: ({ style, children }): JSX.Element => (
+							<TanStackTableStyled style={style}>
+								<colgroup>
+									{orderedColumns.map((column) => {
+										const columnId = getColumnId(column);
+										const isFixedColumn =
+											column.key === 'expand' || column.key === 'state-indicator';
+										const minWidthPx = getColumnMinWidthPx(column, orderedColumns);
+										const persistedWidth = columnSizing[columnId];
+										const computedWidth = table.getColumn(columnId)?.getSize();
+										const effectiveWidth = persistedWidth ?? computedWidth;
+										if (isFixedColumn) {
+											return <col key={columnId} className="tanstack-fixed-col" />;
+										}
+										const widthPx =
+											effectiveWidth != null
+												? Math.max(effectiveWidth, minWidthPx)
+												: minWidthPx;
+										return (
+											<col
+												key={columnId}
+												style={{ width: `${widthPx}px`, minWidth: `${minWidthPx}px` }}
+											/>
+										);
+									})}
+									<col key="logs-table-filler-col" className="tanstack-filler-col" />
+									{isLogsExplorerPage && (
+										<col key="logs-table-actions-col" className="tanstack-actions-col" />
+									)}
+								</colgroup>
+								{children}
+							</TanStackTableStyled>
+						),
+						TableRow: customTableRow,
+					}}
+					{...(infitiyTableProps?.onEndReached
+						? { endReached: handleEndReached }
+						: {})}
+				/>
+				{loadMoreState.active && (
+					<div className="tanstack-load-more-container">
+						<Spinner height="20px" tip="Getting Logs" />
+					</div>
+				)}
+			</div>
+		);
+	},
+);
+
+export default memo(TanStackTableView);

frontend/src/container/LogsExplorerList/TanStackTableView/types.ts

@@ -0,0 +1,31 @@
+import { ColumnSizingState } from '@tanstack/react-table';
+import { ColumnTypeRender } from 'components/Logs/TableView/types';
+import { ILog } from 'types/api/logs/log';
+
+export type TableRecord = Record<string, unknown>;
+
+export type LogsTableColumnDef = {
+	key?: string | number;
+	title?: string;
+	render?: (
+		value: unknown,
+		record: TableRecord,
+		index: number,
+	) => ColumnTypeRender<Record<string, unknown>>;
+};
+
+export type OrderedColumn = LogsTableColumnDef & {
+	key: string | number;
+};
+
+export type TanStackTableRowData = {
+	log: TableRecord;
+	currentLog: ILog;
+	rowIndex: number;
+};
+
+export type PersistedColumnSizing = {
+	version: 1;
+	columnIdsSignature: string;
+	sizing: ColumnSizingState;
+};

frontend/src/container/LogsExplorerList/TanStackTableView/useColumnSizingPersistence.ts

@@ -0,0 +1,113 @@
+import { Dispatch, SetStateAction, useEffect, useMemo, useState } from 'react';
+import { ColumnSizingState } from '@tanstack/react-table';
+import getFromLocalstorage from 'api/browser/localstorage/get';
+import setToLocalstorage from 'api/browser/localstorage/set';
+import { LOCALSTORAGE } from 'constants/localStorage';
+
+import { OrderedColumn, PersistedColumnSizing } from './types';
+import { getColumnId } from './utils';
+
+const COLUMN_SIZING_PERSIST_DEBOUNCE_MS = 250;
+
+const readPersistedColumnSizing = (): ColumnSizingState => {
+	const rawSizing = getFromLocalstorage(LOCALSTORAGE.LOGS_LIST_COLUMN_SIZING);
+	if (!rawSizing) {
+		return {};
+	}
+
+	try {
+		const parsed = JSON.parse(rawSizing) as
+			| PersistedColumnSizing
+			| ColumnSizingState;
+		const sizing = ('sizing' in parsed
+			? parsed.sizing
+			: parsed) as ColumnSizingState;
+
+		return Object.entries(sizing).reduce<ColumnSizingState>(
+			(acc, [key, value]) => {
+				if (typeof value !== 'number' || !Number.isFinite(value) || value <= 0) {
+					return acc;
+				}
+				acc[key] = value;
+				return acc;
+			},
+			{},
+		);
+	} catch (error) {
+		console.error('Failed to parse persisted log column sizing', error);
+		return {};
+	}
+};
+
+type UseColumnSizingPersistenceResult = {
+	columnSizing: ColumnSizingState;
+	setColumnSizing: Dispatch<SetStateAction<ColumnSizingState>>;
+};
+
+export const useColumnSizingPersistence = (
+	orderedColumns: OrderedColumn[],
+): UseColumnSizingPersistenceResult => {
+	const [columnSizing, setColumnSizing] = useState<ColumnSizingState>(() =>
+		readPersistedColumnSizing(),
+	);
+	const orderedColumnIds = useMemo(
+		() => orderedColumns.map((column) => getColumnId(column)),
+		[orderedColumns],
+	);
+	const orderedColumnIdsSignature = useMemo(() => orderedColumnIds.join('|'), [
+		orderedColumnIds,
+	]);
+
+	useEffect(() => {
+		if (orderedColumnIds.length === 0) {
+			return;
+		}
+
+		const validColumnIds = new Set(orderedColumnIds);
+		const nonResizableColumnIds = new Set(
+			orderedColumns
+				.filter(
+					(column) => column.key === 'expand' || column.key === 'state-indicator',
+				)
+				.map((column) => getColumnId(column)),
+		);
+
+		setColumnSizing((previousSizing) => {
+			const nextSizing = Object.entries(previousSizing).reduce<ColumnSizingState>(
+				(acc, [columnId, size]) => {
+					if (!validColumnIds.has(columnId) || nonResizableColumnIds.has(columnId)) {
+						return acc;
+					}
+					acc[columnId] = size;
+					return acc;
+				},
+				{},
+			);
+			const hasChanged =
+				Object.keys(nextSizing).length !== Object.keys(previousSizing).length ||
+				Object.entries(nextSizing).some(
+					([columnId, size]) => previousSizing[columnId] !== size,
+				);
+
+			return hasChanged ? nextSizing : previousSizing;
+		});
+	}, [orderedColumnIds, orderedColumns]);
+
+	useEffect(() => {
+		const timeoutId = window.setTimeout(() => {
+			const persistedSizing: PersistedColumnSizing = {
+				version: 1,
+				columnIdsSignature: orderedColumnIdsSignature,
+				sizing: columnSizing,
+			};
+			setToLocalstorage(
+				LOCALSTORAGE.LOGS_LIST_COLUMN_SIZING,
+				JSON.stringify(persistedSizing),
+			);
+		}, COLUMN_SIZING_PERSIST_DEBOUNCE_MS);
+
+		return (): void => window.clearTimeout(timeoutId);
+	}, [columnSizing, orderedColumnIdsSignature]);
+
+	return { columnSizing, setColumnSizing };
+};

frontend/src/container/LogsExplorerList/TanStackTableView/useOrderedColumns.ts

@@ -0,0 +1,127 @@
+import { useCallback, useEffect, useMemo, useState } from 'react';
+import {
+	DragEndEvent,
+	PointerSensor,
+	useSensor,
+	useSensors,
+} from '@dnd-kit/core';
+import { arrayMove } from '@dnd-kit/sortable';
+import { getDraggedColumns } from 'hooks/useDragColumns/utils';
+
+import { OrderedColumn, TableRecord } from './types';
+import { getColumnId } from './utils';
+
+type UseOrderedColumnsProps = {
+	columns: unknown[];
+	draggedColumns: unknown[];
+	onColumnOrderChange: (columns: unknown[]) => void;
+};
+
+type UseOrderedColumnsResult = {
+	orderedColumns: OrderedColumn[];
+	orderedColumnIds: string[];
+	hasSingleColumn: boolean;
+	handleDragEnd: (event: DragEndEvent) => void;
+	sensors: ReturnType<typeof useSensors>;
+};
+
+export const useOrderedColumns = ({
+	columns,
+	draggedColumns,
+	onColumnOrderChange,
+}: UseOrderedColumnsProps): UseOrderedColumnsResult => {
+	const baseColumns = useMemo<OrderedColumn[]>(
+		() =>
+			getDraggedColumns<TableRecord>(
+				columns as never[],
+				draggedColumns as never[],
+			).filter(
+				(column): column is OrderedColumn =>
+					typeof column.key === 'string' || typeof column.key === 'number',
+			),
+		[columns, draggedColumns],
+	);
+
+	const [orderedColumns, setOrderedColumns] = useState<OrderedColumn[]>(
+		baseColumns,
+	);
+	const sensors = useSensors(
+		useSensor(PointerSensor, {
+			activationConstraint: { distance: 4 },
+		}),
+	);
+
+	useEffect(() => {
+		setOrderedColumns((previousColumns) => {
+			const baseColumnsById = new Map(
+				baseColumns.map((column) => [getColumnId(column), column] as const),
+			);
+			const previousIds = new Set(
+				previousColumns.map((column) => getColumnId(column)),
+			);
+			const orderedFromPrevious = previousColumns
+				.map((column) => baseColumnsById.get(getColumnId(column)))
+				.filter(Boolean) as OrderedColumn[];
+			const appendedNewColumns = baseColumns.filter(
+				(column) => !previousIds.has(getColumnId(column)),
+			);
+			const nextColumns = [...orderedFromPrevious, ...appendedNewColumns];
+
+			if (nextColumns.length !== previousColumns.length) {
+				return nextColumns;
+			}
+
+			const hasReferenceChange = nextColumns.some(
+				(column, index) => column !== previousColumns[index],
+			);
+
+			return hasReferenceChange ? nextColumns : previousColumns;
+		});
+	}, [baseColumns]);
+
+	const handleDragEnd = useCallback(
+		(event: DragEndEvent): void => {
+			const { active, over } = event;
+			if (!over || active.id === over.id) {
+				return;
+			}
+
+			setOrderedColumns((previousColumns) => {
+				const oldIndex = previousColumns.findIndex(
+					(column) => getColumnId(column) === String(active.id),
+				);
+				const newIndex = previousColumns.findIndex(
+					(column) => getColumnId(column) === String(over.id),
+				);
+				if (oldIndex === -1 || newIndex === -1) {
+					return previousColumns;
+				}
+
+				const nextColumns = arrayMove(previousColumns, oldIndex, newIndex);
+				onColumnOrderChange(nextColumns as unknown[]);
+
+				return nextColumns;
+			});
+		},
+		[onColumnOrderChange],
+	);
+
+	const orderedColumnIds = useMemo(
+		() => orderedColumns.map((column) => getColumnId(column)),
+		[orderedColumns],
+	);
+	const hasSingleColumn = useMemo(
+		() =>
+			orderedColumns.filter((column) => column.key !== 'state-indicator')
+				.length === 1,
+		[orderedColumns],
+	);
+
+	return {
+		orderedColumns,
+		orderedColumnIds,
+		hasSingleColumn,
+		handleDragEnd,
+		sensors,
+	};
+};

frontend/src/container/LogsExplorerList/TanStackTableView/utils.ts

@@ -0,0 +1,61 @@
+import { cloneElement, isValidElement, ReactElement } from 'react';
+import { ColumnTypeRender } from 'components/Logs/TableView/types';
+
+import { OrderedColumn } from './types';
+
+export const getColumnId = (column: OrderedColumn): string =>
+	String(column.key);
+
+/** Browser default root font size; TanStack column sizing uses px. */
+const REM_PX = 16;
+const MIN_WIDTH_OTHER_REM = 12;
+const MIN_WIDTH_BODY_REM = 40;
+
+/** When total column count is below this, body column min width is doubled (more horizontal space for few columns). */
+export const FEW_COLUMNS_BODY_MIN_WIDTH_THRESHOLD = 4;
+
+/**
+ * Minimum width (px) for TanStack column defs + colgroup.
+ * Design: state/expand 32px; body min 40rem (doubled when fewer than
+ * {@link FEW_COLUMNS_BODY_MIN_WIDTH_THRESHOLD} total columns); other columns use rem→px (16px root).
+ */
+export const getColumnMinWidthPx = (
+	column: OrderedColumn,
+	orderedColumns?: OrderedColumn[],
+): number => {
+	const key = String(column.key);
+	if (key === 'state-indicator' || key === 'expand') {
+		return 32;
+	}
+	if (key === 'body') {
+		const base = MIN_WIDTH_BODY_REM * REM_PX;
+		const fewColumns =
+			orderedColumns != null &&
+			orderedColumns.length < FEW_COLUMNS_BODY_MIN_WIDTH_THRESHOLD;
+		return fewColumns ? base * 1.5 : base;
+	}
+	return MIN_WIDTH_OTHER_REM * REM_PX;
+};
+
+export const resolveColumnTypeRender = (
+	rendered: ColumnTypeRender<Record<string, unknown>>,
+): ReactElement | string | number | null => {
+	if (
+		rendered &&
+		typeof rendered === 'object' &&
+		'children' in rendered &&
+		isValidElement(rendered.children)
+	) {
+		const { children, props } = rendered as {
+			children: ReactElement;
+			props?: Record<string, unknown>;
+		};
+		return cloneElement(children, props || {});
+	}
+	if (rendered && typeof rendered === 'object' && isValidElement(rendered)) {
+		return rendered;
+	}
+	return typeof rendered === 'string' || typeof rendered === 'number'
+		? rendered
+		: null;
+};

frontend/src/container/LogsExplorerList/index.tsx

@@ -25,9 +25,9 @@ import { ILog } from 'types/api/logs/log';
 import { DataSource, StringOperators } from 'types/common/queryBuilder';
 
 import NoLogs from '../NoLogs/NoLogs';
-import InfinityTableView from './InfinityTableView';
 import { LogsExplorerListProps } from './LogsExplorerList.interfaces';
 import { InfinityWrapperStyled } from './styles';
+import TanStackTableView from './TanStackTableView';
 import {
 	convertKeysToColumnFields,
 	getEmptyLogsListConfig,
@@ -61,7 +61,7 @@ function LogsExplorerList({
 		handleCloseLogDetail,
 	} = useLogDetailHandlers();
 
-	const { options } = useOptionsMenu({
+	const { options, config } = useOptionsMenu({
 		storageKey: LOCALSTORAGE.LOGS_LIST_OPTIONS,
 		dataSource: DataSource.LOGS,
 		aggregateOperator:
@@ -83,6 +83,10 @@ function LogsExplorerList({
 		() => convertKeysToColumnFields(options.selectColumns),
 		[options],
 	);
+	const removableColumnKeys = useMemo(
+		() => options.selectColumns.map((column) => String(column.name)),
+		[options.selectColumns],
+	);
 
 	const handleScrollToLog = useScrollToLog({
 		logs,
@@ -155,9 +159,10 @@ function LogsExplorerList({
 
 		if (options.format === 'table') {
 			return (
-				<InfinityTableView
+				<TanStackTableView
 					ref={ref}
 					isLoading={isLoading}
+					isFetching={isFetching}
 					tableViewProps={{
 						logs,
 						fields: selectedFields,
@@ -172,6 +177,8 @@ function LogsExplorerList({
 					onSetActiveLog={handleSetActiveLog}
 					onClearActiveLog={handleCloseLogDetail}
 					activeLog={activeLog}
+					onRemoveColumn={config.addColumn?.onRemove}
+					removableColumnKeys={removableColumnKeys}
 				/>
 			);
 		}
@@ -216,11 +223,14 @@ function LogsExplorerList({
 		logs,
 		onEndReached,
 		getItemContent,
+		isFetching,
 		selectedFields,
 		handleChangeSelectedView,
 		handleSetActiveLog,
 		handleCloseLogDetail,
 		activeLog,
+		config.addColumn?.onRemove,
+		removableColumnKeys,
 	]);
 
 	const isTraceToLogsNavigation = useMemo(() => {

frontend/src/container/LogsExplorerList/logsTableVirtuosoScrollbar.scss

@@ -0,0 +1,38 @@
+.logs-table-virtuoso-scroll {
+	scrollbar-width: thin;
+	scrollbar-color: var(--bg-slate-300) transparent;
+
+	&::-webkit-scrollbar {
+		width: 4px;
+		height: 4px;
+	}
+
+	&::-webkit-scrollbar-corner {
+		background: transparent;
+	}
+
+	&::-webkit-scrollbar-track {
+		background: transparent;
+	}
+
+	&::-webkit-scrollbar-thumb {
+		background: var(--bg-slate-300);
+		border-radius: 9999px;
+	}
+
+	&::-webkit-scrollbar-thumb:hover {
+		background: var(--bg-slate-200);
+	}
+}
+
+.lightMode .logs-table-virtuoso-scroll {
+	scrollbar-color: var(--bg-vanilla-300) transparent;
+
+	&::-webkit-scrollbar-thumb {
+		background: var(--bg-vanilla-300);
+	}
+
+	&::-webkit-scrollbar-thumb:hover {
+		background: var(--bg-vanilla-100);
+	}
+}

frontend/src/container/LogsExplorerList/styles.ts

@@ -2,7 +2,7 @@ import styled from 'styled-components';
 
 export const InfinityWrapperStyled = styled.div`
 	flex: 1;
-	height: 40rem !important;
 	display: flex;
 	height: 100%;
+	min-height: 0;
 `;

frontend/src/container/LogsExplorerViews/LogsExplorerViews.styles.scss

@@ -1,6 +1,7 @@
 .logs-explorer-views-container {
 	margin-bottom: 24px;
 	flex: 1;
+	min-height: 0;
 	display: flex;
 	flex-direction: column;
 
@@ -9,6 +10,7 @@
 		display: flex;
 		flex-direction: column;
 		flex: 1;
+		min-height: 0;
 		padding-bottom: 10px;
 
 		.views-tabs-container {
@@ -195,6 +197,7 @@
 
 		.logs-explorer-views-type-content {
 			flex: 1;
+			min-height: 0;
 			display: flex;
 			flex-direction: column;
 
@@ -210,12 +213,32 @@
 				}
 			}
 
+			.table-view-container {
+				flex: 1;
+				min-height: 0;
+				overflow-y: visible;
+			}
+
 			.time-series-view-container {
+				flex: 1;
+				display: flex;
+				flex-direction: column;
+				min-height: 0;
+				overflow-y: visible;
+
 				.time-series-view-container-header {
 					display: flex;
 					justify-content: flex-start;
 					align-items: center;
 					padding: 12px;
+					flex-shrink: 0;
+				}
+
+				.time-series-view {
+					flex-shrink: 0;
+					height: 65vh;
+					min-height: 450px;
+					padding-bottom: 140px;
 				}
 			}
 		}

frontend/src/container/LogsExplorerViews/index.tsx

@@ -499,16 +499,18 @@ function LogsExplorerViewsContainer({
 						</div>
 					)}
 					{selectedPanelType === PANEL_TYPES.TABLE && !showLiveLogs && (
-						<LogsExplorerTable
-							data={
-								(data?.payload?.data?.newResult?.data?.result ||
-									data?.payload?.data?.result ||
-									[]) as QueryDataV3[]
-							}
-							isLoading={isLoading || isFetching}
-							isError={isError}
-							error={error as APIError}
-						/>
+						<div className="table-view-container">
+							<LogsExplorerTable
+								data={
+									(data?.payload?.data?.newResult?.data?.result ||
+										data?.payload?.data?.result ||
+										[]) as QueryDataV3[]
+								}
+								isLoading={isLoading || isFetching}
+								isError={isError}
+								error={error as APIError}
+							/>
+						</div>
 					)}
 				</div>
 			</div>

frontend/src/pages/LogsExplorer/LogsExplorer.styles.scss

@@ -1,6 +1,9 @@
 .logs-module-page {
 	display: flex;
 	height: 100%;
+	min-height: 0;
+	overflow: hidden;
+
 	.log-quick-filter-left-section {
 		width: 0%;
 		flex-shrink: 0;
@@ -10,13 +13,19 @@
 		display: flex;
 		flex-direction: column;
 		width: 100%;
+		min-height: 0;
+
 		.log-explorer-query-container {
 			display: flex;
 			flex-direction: column;
 			flex: 1;
+			min-height: 0;
+			overflow-y: auto;
+			overflow-x: hidden;
 
 			.logs-explorer-views {
 				flex: 1;
+				min-height: 0;
 				display: flex;
 				flex-direction: column;
 			}
@@ -26,6 +35,18 @@
 	&.filter-visible {
 		.log-quick-filter-left-section {
 			width: 260px;
+			height: 100%;
+			overflow: visible;
+			min-height: 0;
+			position: relative;
+			z-index: 2;
+			display: flex;
+			flex-direction: column;
+
+			.quick-filters-container {
+				flex: 1;
+				min-height: 0;
+			}
 		}
 
 		.log-module-right-section {

frontend/src/pages/LogsModulePage/LogsModulePage.styles.scss

@@ -1,10 +1,14 @@
 .logs-module-container {
 	flex: 1;
+	min-height: 0;
 	display: flex;
 	flex-direction: column;
 
 	.ant-tabs {
 		flex: 1;
+		min-height: 0;
+		display: flex;
+		flex-direction: column;
 	}
 
 	.ant-tabs-nav {
@@ -18,14 +22,17 @@
 
 	.ant-tabs-content-holder {
 		display: flex;
+		min-height: 0;
 
 		.ant-tabs-content {
 			flex: 1;
+			min-height: 0;
 			display: flex;
 			flex-direction: column;
 
 			.ant-tabs-tabpane {
 				flex: 1;
+				min-height: 0;
 				display: flex;
 				flex-direction: column;
 			}

frontend/yarn.lock

@@ -6017,26 +6017,19 @@
   dependencies:
     defer-to-connect "^2.0.0"
 
-"@tanstack/react-table@8.20.6":
-  version "8.20.6"
-  resolved "https://registry.yarnpkg.com/@tanstack/react-table/-/react-table-8.20.6.tgz#a1f3103327aa59aa621931f4087a7604a21054d0"
-  integrity sha512-w0jluT718MrOKthRcr2xsjqzx+oEM7B7s/XXyfs19ll++hlId3fjTm+B2zrR3ijpANpkzBAr15j1XGVOMxpggQ==
-  dependencies:
-    "@tanstack/table-core" "8.20.5"
-
-"@tanstack/react-table@^8.21.3":
+"@tanstack/react-table@8.21.3", "@tanstack/react-table@^8.21.3":
   version "8.21.3"
   resolved "https://registry.yarnpkg.com/@tanstack/react-table/-/react-table-8.21.3.tgz#2c38c747a5731c1a07174fda764b9c2b1fb5e91b"
   integrity sha512-5nNMTSETP4ykGegmVkhjcS8tTLW6Vl4axfEGQN3v0zdHYbK4UfoqfPChclTrJ4EoK9QynqAu9oUf8VEmrpZ5Ww==
   dependencies:
     "@tanstack/table-core" "8.21.3"
 
-"@tanstack/react-virtual@3.11.2":
-  version "3.11.2"
-  resolved "https://registry.yarnpkg.com/@tanstack/react-virtual/-/react-virtual-3.11.2.tgz#d6b9bd999c181f0a2edce270c87a2febead04322"
-  integrity sha512-OuFzMXPF4+xZgx8UzJha0AieuMihhhaWG0tCqpp6tDzlFwOmNBPYMuLOtMJ1Tr4pXLHmgjcWhG6RlknY2oNTdQ==
+"@tanstack/react-virtual@3.13.22":
+  version "3.13.22"
+  resolved "https://registry.yarnpkg.com/@tanstack/react-virtual/-/react-virtual-3.13.22.tgz#9a5529dee4010f33272ae3b3e3728dee317b3b42"
+  integrity sha512-EaOrBBJLi3M0bTMQRjGkxLXRw7Gizwntoy5E2Q2UnSbML7Mo2a1P/Hfkw5tw9FLzK62bj34Jl6VNbQfRV6eJcA==
   dependencies:
-    "@tanstack/virtual-core" "3.11.2"
+    "@tanstack/virtual-core" "3.13.22"
 
 "@tanstack/react-virtual@^3.13.9":
   version "3.13.12"
@@ -6045,26 +6038,21 @@
   dependencies:
     "@tanstack/virtual-core" "3.13.12"
 
-"@tanstack/table-core@8.20.5":
-  version "8.20.5"
-  resolved "https://registry.yarnpkg.com/@tanstack/table-core/-/table-core-8.20.5.tgz#3974f0b090bed11243d4107283824167a395cf1d"
-  integrity sha512-P9dF7XbibHph2PFRz8gfBKEXEY/HJPOhym8CHmjF8y3q5mWpKx9xtZapXQUWCgkqvsK0R46Azuz+VaxD4Xl+Tg==
-
 "@tanstack/table-core@8.21.3":
   version "8.21.3"
   resolved "https://registry.yarnpkg.com/@tanstack/table-core/-/table-core-8.21.3.tgz#2977727d8fc8dfa079112d9f4d4c019110f1732c"
   integrity sha512-ldZXEhOBb8Is7xLs01fR3YEc3DERiz5silj8tnGkFZytt1abEvl/GhUmCE0PMLaMPTa3Jk4HbKmRlHmu+gCftg==
 
-"@tanstack/virtual-core@3.11.2":
-  version "3.11.2"
-  resolved "https://registry.yarnpkg.com/@tanstack/virtual-core/-/virtual-core-3.11.2.tgz#00409e743ac4eea9afe5b7708594d5fcebb00212"
-  integrity sha512-vTtpNt7mKCiZ1pwU9hfKPhpdVO2sVzFQsxoVBGtOSHxlrRRzYr8iQ2TlwbAcRYCcEiZ9ECAM8kBzH0v2+VzfKw==
-
 "@tanstack/virtual-core@3.13.12":
   version "3.13.12"
   resolved "https://registry.yarnpkg.com/@tanstack/virtual-core/-/virtual-core-3.13.12.tgz#1dff176df9cc8f93c78c5e46bcea11079b397578"
   integrity sha512-1YBOJfRHV4sXUmWsFSf5rQor4Ss82G8dQWLRbnk3GA4jeP8hQt1hxXh0tmflpC0dz3VgEv/1+qwPyLeWkQuPFA==
 
+"@tanstack/virtual-core@3.13.22":
+  version "3.13.22"
+  resolved "https://registry.yarnpkg.com/@tanstack/virtual-core/-/virtual-core-3.13.22.tgz#660a2cd048510125a4da898e5a659d53166f51af"
+  integrity sha512-isuUGKsc5TAPDoHSbWTbl1SCil54zOS2MiWz/9GCWHPUQOvNTQx8qJEWC7UWR0lShhbK0Lmkcf0SZYxvch7G3g==
+
 "@testing-library/dom@^8.5.0":
   version "8.20.0"
   resolved "https://registry.npmjs.org/@testing-library/dom/-/dom-8.20.0.tgz"

pkg/apiserver/signozapiserver/user.go

@@ -111,7 +111,7 @@ func (provider *provider) addUserRoutes(router *mux.Router) error {
 		return err
 	}
 
-	if err := router.Handle("/api/v1/user", handler.New(provider.authZ.AdminAccess(provider.userHandler.ListUsersDeprecated), handler.OpenAPIDef{
+	if err := router.Handle("/api/v1/user", handler.New(provider.authZ.AdminAccess(provider.userHandler.ListUsers), handler.OpenAPIDef{
 		ID:                  "ListUsers",
 		Tags:                []string{"users"},
 		Summary:             "List users",
@@ -128,24 +128,7 @@ func (provider *provider) addUserRoutes(router *mux.Router) error {
 		return err
 	}
 
-	if err := router.Handle("/api/v2/users", handler.New(provider.authZ.AdminAccess(provider.userHandler.ListUsers), handler.OpenAPIDef{
-		ID:                  "ListUsersV2",
-		Tags:                []string{"users"},
-		Summary:             "List users v2",
-		Description:         "This endpoint lists all users for the organization",
-		Request:             nil,
-		RequestContentType:  "",
-		Response:            make([]*types.User, 0),
-		ResponseContentType: "application/json",
-		SuccessStatusCode:   http.StatusOK,
-		ErrorStatusCodes:    []int{},
-		Deprecated:          false,
-		SecuritySchemes:     newSecuritySchemes(types.RoleAdmin),
-	})).Methods(http.MethodGet).GetError(); err != nil {
-		return err
-	}
-
-	if err := router.Handle("/api/v1/user/me", handler.New(provider.authZ.OpenAccess(provider.userHandler.GetMyUserDeprecated), handler.OpenAPIDef{
+	if err := router.Handle("/api/v1/user/me", handler.New(provider.authZ.OpenAccess(provider.userHandler.GetMyUser), handler.OpenAPIDef{
 		ID:                  "GetMyUser",
 		Tags:                []string{"users"},
 		Summary:             "Get my user",
@@ -162,41 +145,7 @@ func (provider *provider) addUserRoutes(router *mux.Router) error {
 		return err
 	}
 
-	if err := router.Handle("/api/v2/users/me", handler.New(provider.authZ.OpenAccess(provider.userHandler.GetMyUser), handler.OpenAPIDef{
-		ID:                  "GetMyUserV2",
-		Tags:                []string{"users"},
-		Summary:             "Get my user v2",
-		Description:         "This endpoint returns the user I belong to",
-		Request:             nil,
-		RequestContentType:  "",
-		Response:            new(authtypes.UserWithRoles),
-		ResponseContentType: "application/json",
-		SuccessStatusCode:   http.StatusOK,
-		ErrorStatusCodes:    []int{},
-		Deprecated:          false,
-		SecuritySchemes:     []handler.OpenAPISecurityScheme{{Name: authtypes.IdentNProviderTokenizer.StringValue()}},
-	})).Methods(http.MethodGet).GetError(); err != nil {
-		return err
-	}
-
-	if err := router.Handle("/api/v2/users/me", handler.New(provider.authZ.OpenAccess(provider.userHandler.UpdateMyUser), handler.OpenAPIDef{
-		ID:                  "UpdateMyUserV2",
-		Tags:                []string{"users"},
-		Summary:             "Update my user v2",
-		Description:         "This endpoint updates the user I belong to",
-		Request:             new(types.UpdatableSelfUser),
-		RequestContentType:  "application/json",
-		Response:            nil,
-		ResponseContentType: "",
-		SuccessStatusCode:   http.StatusNoContent,
-		ErrorStatusCodes:    []int{},
-		Deprecated:          false,
-		SecuritySchemes:     []handler.OpenAPISecurityScheme{{Name: authtypes.IdentNProviderTokenizer.StringValue()}},
-	})).Methods(http.MethodPut).GetError(); err != nil {
-		return err
-	}
-
-	if err := router.Handle("/api/v1/user/{id}", handler.New(provider.authZ.SelfAccess(provider.userHandler.GetUserDeprecated), handler.OpenAPIDef{
+	if err := router.Handle("/api/v1/user/{id}", handler.New(provider.authZ.SelfAccess(provider.userHandler.GetUser), handler.OpenAPIDef{
 		ID:                  "GetUser",
 		Tags:                []string{"users"},
 		Summary:             "Get user",
@@ -213,24 +162,7 @@ func (provider *provider) addUserRoutes(router *mux.Router) error {
 		return err
 	}
 
-	if err := router.Handle("/api/v2/users/{id}", handler.New(provider.authZ.AdminAccess(provider.userHandler.GetUser), handler.OpenAPIDef{
-		ID:                  "GetUserV2",
-		Tags:                []string{"users"},
-		Summary:             "Get user by user id",
-		Description:         "This endpoint returns the user by id",
-		Request:             nil,
-		RequestContentType:  "",
-		Response:            new(types.User),
-		ResponseContentType: "application/json",
-		SuccessStatusCode:   http.StatusOK,
-		ErrorStatusCodes:    []int{http.StatusNotFound},
-		Deprecated:          false,
-		SecuritySchemes:     newSecuritySchemes(types.RoleAdmin),
-	})).Methods(http.MethodGet).GetError(); err != nil {
-		return err
-	}
-
-	if err := router.Handle("/api/v1/user/{id}", handler.New(provider.authZ.SelfAccess(provider.userHandler.UpdateUserDeprecated), handler.OpenAPIDef{
+	if err := router.Handle("/api/v1/user/{id}", handler.New(provider.authZ.SelfAccess(provider.userHandler.UpdateUser), handler.OpenAPIDef{
 		ID:                  "UpdateUser",
 		Tags:                []string{"users"},
 		Summary:             "Update user",
@@ -247,23 +179,6 @@ func (provider *provider) addUserRoutes(router *mux.Router) error {
 		return err
 	}
 
-	if err := router.Handle("/api/v2/users/{id}", handler.New(provider.authZ.AdminAccess(provider.userHandler.UpdateUser), handler.OpenAPIDef{
-		ID:                  "UpdateUserV2",
-		Tags:                []string{"users"},
-		Summary:             "Update user v2",
-		Description:         "This endpoint updates the user by id",
-		Request:             new(types.UpdatableUser),
-		RequestContentType:  "application/json",
-		Response:            nil,
-		ResponseContentType: "",
-		SuccessStatusCode:   http.StatusNoContent,
-		ErrorStatusCodes:    []int{http.StatusBadRequest, http.StatusNotFound},
-		Deprecated:          false,
-		SecuritySchemes:     newSecuritySchemes(types.RoleAdmin),
-	})).Methods(http.MethodPut).GetError(); err != nil {
-		return err
-	}
-
 	if err := router.Handle("/api/v1/user/{id}", handler.New(provider.authZ.AdminAccess(provider.userHandler.DeleteUser), handler.OpenAPIDef{
 		ID:                  "DeleteUser",
 		Tags:                []string{"users"},
@@ -349,39 +264,5 @@ func (provider *provider) addUserRoutes(router *mux.Router) error {
 		return err
 	}
 
-	if err := router.Handle("/api/v2/users/{id}/roles", handler.New(provider.authZ.AdminAccess(provider.userHandler.GetUserRoles), handler.OpenAPIDef{
-		ID:                  "GetUserRoles",
-		Tags:                []string{"users"},
-		Summary:             "Get user roles",
-		Description:         "This endpoint returns the user roles by user id",
-		Request:             nil,
-		RequestContentType:  "",
-		Response:            make([]*authtypes.Role, 0),
-		ResponseContentType: "application/json",
-		SuccessStatusCode:   http.StatusOK,
-		ErrorStatusCodes:    []int{http.StatusNotFound},
-		Deprecated:          false,
-		SecuritySchemes:     newSecuritySchemes(types.RoleAdmin),
-	})).Methods(http.MethodGet).GetError(); err != nil {
-		return err
-	}
-
-	if err := router.Handle("/api/v2/roles/{id}/users", handler.New(provider.authZ.AdminAccess(provider.userHandler.GetUsersByRoleID), handler.OpenAPIDef{
-		ID:                  "GetUsersByRoleID",
-		Tags:                []string{"users"},
-		Summary:             "Get users by role id",
-		Description:         "This endpoint returns the users having the role by role id",
-		Request:             nil,
-		RequestContentType:  "",
-		Response:            make([]*types.User, 0),
-		ResponseContentType: "application/json",
-		SuccessStatusCode:   http.StatusOK,
-		ErrorStatusCodes:    []int{http.StatusNotFound},
-		Deprecated:          false,
-		SecuritySchemes:     newSecuritySchemes(types.RoleAdmin),
-	})).Methods(http.MethodGet).GetError(); err != nil {
-		return err
-	}
-
 	return nil
 }

pkg/modules/user/impluser/getter.go

@@ -37,7 +37,7 @@ func (module *getter) GetRootUserByOrgID(ctx context.Context, orgID valuer.UUID)
 	return rootUser, userRoles, nil
 }
 
-func (module *getter) ListByOrgIDDeprecated(ctx context.Context, orgID valuer.UUID) ([]*types.DeprecatedUser, error) {
+func (module *getter) ListByOrgID(ctx context.Context, orgID valuer.UUID) ([]*types.DeprecatedUser, error) {
 	users, err := module.store.ListUsersByOrgID(ctx, orgID)
 	if err != nil {
 		return nil, err
@@ -84,23 +84,6 @@ func (module *getter) ListByOrgIDDeprecated(ctx context.Context, orgID valuer.UU
 	return deprecatedUsers, nil
 }
 
-func (module *getter) ListByOrgID(ctx context.Context, orgID valuer.UUID) ([]*types.User, error) {
-	users, err := module.store.ListUsersByOrgID(ctx, orgID)
-	if err != nil {
-		return nil, err
-	}
-
-	// filter root users if feature flag `hide_root_users` is true
-	evalCtx := featuretypes.NewFlaggerEvaluationContext(orgID)
-	hideRootUsers := module.flagger.BooleanOrEmpty(ctx, flagger.FeatureHideRootUser, evalCtx)
-
-	if hideRootUsers {
-		users = slices.DeleteFunc(users, func(user *types.User) bool { return user.IsRoot })
-	}
-
-	return users, nil
-}
-
 func (module *getter) GetDeprecatedUserByOrgIDAndID(ctx context.Context, orgID valuer.UUID, id valuer.UUID) (*types.DeprecatedUser, error) {
 	user, err := module.store.GetByOrgIDAndID(ctx, orgID, id)
 	if err != nil {
@@ -116,19 +99,11 @@ func (module *getter) GetDeprecatedUserByOrgIDAndID(ctx context.Context, orgID v
 		return nil, errors.New(errors.TypeUnexpected, authtypes.ErrCodeUserRolesNotFound, "no user roles entries found")
 	}
 
-	if userRoles[0].Role == nil {
-		return nil, errors.New(errors.TypeUnexpected, authtypes.ErrCodeRoleNotFound, "role not found for user role entry")
-	}
-
 	role := authtypes.SigNozManagedRoleToExistingLegacyRole[userRoles[0].Role.Name]
 
 	return types.NewDeprecatedUserFromUserAndRole(user, role), nil
 }
 
-func (module *getter) GetUserByOrgIDAndID(ctx context.Context, orgID valuer.UUID, userID valuer.UUID) (*types.User, error) {
-	return module.store.GetByOrgIDAndID(ctx, orgID, userID)
-}
-
 func (module *getter) Get(ctx context.Context, id valuer.UUID) (*types.DeprecatedUser, error) {
 	user, err := module.store.GetUser(ctx, id)
 	if err != nil {
@@ -144,10 +119,6 @@ func (module *getter) Get(ctx context.Context, id valuer.UUID) (*types.Deprecate
 		return nil, errors.New(errors.TypeUnexpected, authtypes.ErrCodeUserRolesNotFound, "no user roles entries found")
 	}
 
-	if userRoles[0].Role == nil {
-		return nil, errors.New(errors.TypeUnexpected, authtypes.ErrCodeRoleNotFound, "role not found for user role entry")
-	}
-
 	role := authtypes.SigNozManagedRoleToExistingLegacyRole[userRoles[0].Role.Name]
 
 	return types.NewDeprecatedUserFromUserAndRole(user, role), nil
@@ -209,15 +180,5 @@ func (module *getter) GetUserRoles(ctx context.Context, userID valuer.UUID) ([]*
 		return nil, err
 	}
 
-	for _, ur := range userRoles {
-		if ur.Role == nil {
-			return nil, errors.New(errors.TypeUnexpected, authtypes.ErrCodeRoleNotFound, "role not found for user role entry")
-		}
-	}
-
 	return userRoles, nil
 }
-
-func (module *getter) GetUsersByOrgIDAndRoleID(ctx context.Context, orgID valuer.UUID, roleID valuer.UUID) ([]*types.User, error) {
-	return module.store.GetUsersByOrgIDAndRoleID(ctx, orgID, roleID)
-}

pkg/modules/user/impluser/handler.go

@@ -85,7 +85,7 @@ func (h *handler) CreateBulkInvite(rw http.ResponseWriter, r *http.Request) {
 	render.Success(rw, http.StatusCreated, nil)
 }
 
-func (h *handler) GetUserDeprecated(w http.ResponseWriter, r *http.Request) {
+func (h *handler) GetUser(w http.ResponseWriter, r *http.Request) {
 	ctx, cancel := context.WithTimeout(r.Context(), 10*time.Second)
 	defer cancel()
 
@@ -106,28 +106,7 @@ func (h *handler) GetUserDeprecated(w http.ResponseWriter, r *http.Request) {
 	render.Success(w, http.StatusOK, user)
 }
 
-func (h *handler) GetUser(w http.ResponseWriter, r *http.Request) {
-	ctx, cancel := context.WithTimeout(r.Context(), 10*time.Second)
-	defer cancel()
-
-	userID := mux.Vars(r)["id"]
-
-	claims, err := authtypes.ClaimsFromContext(ctx)
-	if err != nil {
-		render.Error(w, err)
-		return
-	}
-
-	user, err := h.getter.GetUserByOrgIDAndID(ctx, valuer.MustNewUUID(claims.OrgID), valuer.MustNewUUID(userID))
-	if err != nil {
-		render.Error(w, err)
-		return
-	}
-
-	render.Success(w, http.StatusOK, user)
-}
-
-func (h *handler) GetMyUserDeprecated(w http.ResponseWriter, r *http.Request) {
+func (h *handler) GetMyUser(w http.ResponseWriter, r *http.Request) {
 	ctx, cancel := context.WithTimeout(r.Context(), 10*time.Second)
 	defer cancel()
 
@@ -146,85 +125,6 @@ func (h *handler) GetMyUserDeprecated(w http.ResponseWriter, r *http.Request) {
 	render.Success(w, http.StatusOK, user)
 }
 
-func (h *handler) GetMyUser(w http.ResponseWriter, r *http.Request) {
-	ctx, cancel := context.WithTimeout(r.Context(), 10*time.Second)
-	defer cancel()
-
-	claims, err := authtypes.ClaimsFromContext(ctx)
-	if err != nil {
-		render.Error(w, err)
-		return
-	}
-
-	user, err := h.getter.GetUserByOrgIDAndID(ctx, valuer.MustNewUUID(claims.OrgID), valuer.MustNewUUID(claims.UserID))
-	if err != nil {
-		render.Error(w, err)
-		return
-	}
-
-	userRoles, err := h.getter.GetUserRoles(ctx, user.ID)
-	if err != nil {
-		render.Error(w, err)
-		return
-	}
-
-	roles := make([]*authtypes.Role, len(userRoles))
-	for idx, userRole := range userRoles {
-		roles[idx] = authtypes.NewRoleFromStorableRole(userRole.Role)
-	}
-
-	userWithRoles := &authtypes.UserWithRoles{
-		User:  user,
-		Roles: roles,
-	}
-
-	render.Success(w, http.StatusOK, userWithRoles)
-}
-
-func (h *handler) UpdateMyUser(w http.ResponseWriter, r *http.Request) {
-	ctx, cancel := context.WithTimeout(r.Context(), 10*time.Second)
-	defer cancel()
-
-	claims, err := authtypes.ClaimsFromContext(ctx)
-	if err != nil {
-		render.Error(w, err)
-		return
-	}
-
-	updatableSelfUser := new(types.UpdatableSelfUser)
-	if err := json.NewDecoder(r.Body).Decode(&updatableSelfUser); err != nil {
-		render.Error(w, err)
-		return
-	}
-
-	_, err = h.setter.UpdateMyUser(ctx, valuer.MustNewUUID(claims.OrgID), valuer.MustNewUUID(claims.UserID), updatableSelfUser)
-	if err != nil {
-		render.Error(w, err)
-		return
-	}
-
-	render.Success(w, http.StatusNoContent, nil)
-}
-
-func (h *handler) ListUsersDeprecated(w http.ResponseWriter, r *http.Request) {
-	ctx, cancel := context.WithTimeout(r.Context(), 10*time.Second)
-	defer cancel()
-
-	claims, err := authtypes.ClaimsFromContext(ctx)
-	if err != nil {
-		render.Error(w, err)
-		return
-	}
-
-	users, err := h.getter.ListByOrgIDDeprecated(ctx, valuer.MustNewUUID(claims.OrgID))
-	if err != nil {
-		render.Error(w, err)
-		return
-	}
-
-	render.Success(w, http.StatusOK, users)
-}
-
 func (h *handler) ListUsers(w http.ResponseWriter, r *http.Request) {
 	ctx, cancel := context.WithTimeout(r.Context(), 10*time.Second)
 	defer cancel()
@@ -244,7 +144,7 @@ func (h *handler) ListUsers(w http.ResponseWriter, r *http.Request) {
 	render.Success(w, http.StatusOK, users)
 }
 
-func (h *handler) UpdateUserDeprecated(w http.ResponseWriter, r *http.Request) {
+func (h *handler) UpdateUser(w http.ResponseWriter, r *http.Request) {
 	ctx, cancel := context.WithTimeout(r.Context(), 10*time.Second)
 	defer cancel()
 
@@ -262,7 +162,7 @@ func (h *handler) UpdateUserDeprecated(w http.ResponseWriter, r *http.Request) {
 		return
 	}
 
-	updatedUser, err := h.setter.UpdateUserDeprecated(ctx, valuer.MustNewUUID(claims.OrgID), id, &user, claims.UserID)
+	updatedUser, err := h.setter.UpdateUser(ctx, valuer.MustNewUUID(claims.OrgID), id, &user, claims.UserID)
 	if err != nil {
 		render.Error(w, err)
 		return
@@ -271,33 +171,6 @@ func (h *handler) UpdateUserDeprecated(w http.ResponseWriter, r *http.Request) {
 	render.Success(w, http.StatusOK, updatedUser)
 }
 
-func (h *handler) UpdateUser(w http.ResponseWriter, r *http.Request) {
-	ctx, cancel := context.WithTimeout(r.Context(), 10*time.Second)
-	defer cancel()
-
-	userID := mux.Vars(r)["id"]
-
-	claims, err := authtypes.ClaimsFromContext(ctx)
-	if err != nil {
-		render.Error(w, err)
-		return
-	}
-
-	updatableUser := new(types.UpdatableUser)
-	if err := json.NewDecoder(r.Body).Decode(&updatableUser); err != nil {
-		render.Error(w, err)
-		return
-	}
-
-	_, err = h.setter.UpdateUser(ctx, valuer.MustNewUUID(claims.OrgID), valuer.MustNewUUID(userID), updatableUser, valuer.MustNewUUID(claims.UserID))
-	if err != nil {
-		render.Error(w, err)
-		return
-	}
-
-	render.Success(w, http.StatusNoContent, nil)
-}
-
 func (h *handler) DeleteUser(w http.ResponseWriter, r *http.Request) {
 	ctx, cancel := context.WithTimeout(r.Context(), 10*time.Second)
 	defer cancel()
@@ -570,56 +443,3 @@ func (h *handler) RevokeAPIKey(w http.ResponseWriter, r *http.Request) {
 
 	render.Success(w, http.StatusNoContent, nil)
 }
-
-func (h *handler) GetUserRoles(w http.ResponseWriter, r *http.Request) {
-	ctx, cancel := context.WithTimeout(r.Context(), 10*time.Second)
-	defer cancel()
-
-	userID := mux.Vars(r)["id"]
-
-	claims, err := authtypes.ClaimsFromContext(ctx)
-	if err != nil {
-		render.Error(w, err)
-		return
-	}
-
-	user, err := h.getter.GetUserByOrgIDAndID(ctx, valuer.MustNewUUID(claims.OrgID), valuer.MustNewUUID(userID))
-	if err != nil {
-		render.Error(w, err)
-		return
-	}
-
-	userRoles, err := h.getter.GetUserRoles(ctx, user.ID)
-	if err != nil {
-		render.Error(w, err)
-		return
-	}
-
-	roles := make([]*authtypes.Role, len(userRoles))
-	for idx, userRole := range userRoles {
-		roles[idx] = authtypes.NewRoleFromStorableRole(userRole.Role)
-	}
-
-	render.Success(w, http.StatusOK, roles)
-}
-
-func (h *handler) GetUsersByRoleID(w http.ResponseWriter, r *http.Request) {
-	ctx, cancel := context.WithTimeout(r.Context(), 10*time.Second)
-	defer cancel()
-
-	roleID := mux.Vars(r)["id"]
-
-	claims, err := authtypes.ClaimsFromContext(ctx)
-	if err != nil {
-		render.Error(w, err)
-		return
-	}
-
-	users, err := h.getter.GetUsersByOrgIDAndRoleID(ctx, valuer.MustNewUUID(claims.OrgID), valuer.MustNewUUID(roleID))
-	if err != nil {
-		render.Error(w, err)
-		return
-	}
-
-	render.Success(w, http.StatusOK, users)
-}

pkg/modules/user/impluser/service.go

@@ -156,7 +156,9 @@ func (s *service) createOrPromoteRootUser(ctx context.Context, orgID valuer.UUID
 		existingUser.PromoteToRoot()
 
 		err = s.store.RunInTx(ctx, func(ctx context.Context) error {
-			if err := s.setter.UpdateAnyUser(ctx, orgID, existingUser); err != nil {
+			// update users table
+			deprecatedUser := types.NewDeprecatedUserFromUserAndRole(existingUser, types.RoleAdmin)
+			if err := s.setter.UpdateAnyUser(ctx, orgID, deprecatedUser); err != nil {
 				return err
 			}
 
@@ -199,7 +201,8 @@ func (s *service) updateExistingRootUser(ctx context.Context, orgID valuer.UUID,
 
 	if existingRoot.Email != s.config.Email {
 		existingRoot.UpdateEmail(s.config.Email)
-		if err := s.setter.UpdateAnyUser(ctx, orgID, existingRoot); err != nil {
+		deprecatedUser := types.NewDeprecatedUserFromUserAndRole(existingRoot, types.RoleAdmin)
+		if err := s.setter.UpdateAnyUser(ctx, orgID, deprecatedUser); err != nil {
 			return err
 		}
 	}

pkg/modules/user/impluser/setter.go

@@ -220,7 +220,7 @@ func (module *setter) CreateUser(ctx context.Context, user *types.User, opts ...
 	return nil
 }
 
-func (module *setter) UpdateUserDeprecated(ctx context.Context, orgID valuer.UUID, id string, user *types.DeprecatedUser, updatedBy string) (*types.DeprecatedUser, error) {
+func (module *setter) UpdateUser(ctx context.Context, orgID valuer.UUID, id string, user *types.DeprecatedUser, updatedBy string) (*types.DeprecatedUser, error) {
 	existingUser, err := module.getter.GetDeprecatedUserByOrgIDAndID(ctx, orgID, valuer.MustNewUUID(id))
 	if err != nil {
 		return nil, err
@@ -265,7 +265,7 @@ func (module *setter) UpdateUserDeprecated(ctx context.Context, orgID valuer.UUI
 	existingUser.Update(user.DisplayName, user.Role)
 
 	// update the user - idempotent (this does analytics too so keeping it outside txn)
-	if err := module.UpdateAnyUserDeprecated(ctx, orgID, existingUser); err != nil {
+	if err := module.UpdateAnyUser(ctx, orgID, existingUser); err != nil {
 		return nil, err
 	}
 
@@ -291,113 +291,7 @@ func (module *setter) UpdateUserDeprecated(ctx context.Context, orgID valuer.UUI
 	return existingUser, nil
 }
 
-func (module *setter) UpdateMyUser(ctx context.Context, orgID valuer.UUID, userID valuer.UUID, updatable *types.UpdatableSelfUser) (*types.User, error) {
-	existingUser, err := module.getter.GetUserByOrgIDAndID(ctx, orgID, userID)
-	if err != nil {
-		return nil, err
-	}
-
-	if err := existingUser.ErrIfRoot(); err != nil {
-		return nil, errors.WithAdditionalf(err, "cannot update root user")
-	}
-
-	if err := existingUser.ErrIfDeleted(); err != nil {
-		return nil, errors.WithAdditionalf(err, "cannot update deleted user")
-	}
-
-	existingUser.Update(updatable.DisplayName)
-	if err := module.UpdateAnyUser(ctx, orgID, existingUser); err != nil {
-		return nil, err
-	}
-
-	return existingUser, nil
-}
-
-func (module *setter) UpdateUser(ctx context.Context, orgID valuer.UUID, userID valuer.UUID, updatable *types.UpdatableUser, updatedBy valuer.UUID) (*types.User, error) {
-	existingUser, err := module.getter.GetUserByOrgIDAndID(ctx, orgID, userID)
-	if err != nil {
-		return nil, err
-	}
-
-	if err := existingUser.ErrIfRoot(); err != nil {
-		return nil, errors.WithAdditionalf(err, "cannot update root user")
-	}
-
-	if err := existingUser.ErrIfDeleted(); err != nil {
-		return nil, errors.WithAdditionalf(err, "cannot update deleted user")
-	}
-
-	existingUserRoles, err := module.getter.GetUserRoles(ctx, existingUser.ID)
-	if err != nil {
-		return nil, err
-	}
-
-	existingUserRoleNames := roleNamesFromUserRoles(existingUserRoles)
-
-	var grants, revokes []string
-	var rolesChanged bool
-	if len(updatable.RoleNames) > 0 {
-		// validate that all requested role names exist before making any changes
-		_, err := module.authz.ListByOrgIDAndNames(ctx, orgID, updatable.RoleNames)
-		if err != nil {
-			return nil, err
-		}
-	}
-
-	grants, revokes = module.patchRolesNames(existingUserRoleNames, updatable.RoleNames)
-	rolesChanged = (len(grants) > 0) || (len(revokes) > 0)
-
-	if rolesChanged && existingUser.ID == updatedBy {
-		return nil, errors.New(errors.TypeForbidden, errors.CodeForbidden, "cannot change self roles")
-	}
-
-	if rolesChanged {
-		err = module.authz.ModifyGrant(
-			ctx,
-			orgID,
-			revokes,
-			grants,
-			authtypes.MustNewSubject(authtypes.TypeableUser, userID.String(), orgID, nil),
-		)
-		if err != nil {
-			return nil, err
-		}
-	}
-
-	existingUser.Update(updatable.DisplayName)
-
-	if err := module.UpdateAnyUser(ctx, existingUser.OrgID, existingUser); err != nil {
-		return nil, err
-	}
-
-	if rolesChanged {
-		// this by default runs in txn
-		if err := module.UpdateUserRoles(ctx, existingUser.OrgID, existingUser.ID, updatable.RoleNames); err != nil {
-			return nil, err
-		}
-	}
-
-	return existingUser, nil
-}
-
-func (module *setter) UpdateAnyUser(ctx context.Context, orgID valuer.UUID, user *types.User) error {
-	if err := module.store.UpdateUser(ctx, orgID, user); err != nil {
-		return err
-	}
-
-	if err := module.tokenizer.DeleteIdentity(ctx, user.ID); err != nil {
-		return err
-	}
-
-	// stats collector things
-	traits := types.NewTraitsFromUser(user)
-	module.analytics.IdentifyUser(ctx, user.OrgID.String(), user.ID.String(), traits)
-	module.analytics.TrackUser(ctx, user.OrgID.String(), user.ID.String(), "User Updated", traits)
-
-	return nil
-}
-
-func (module *setter) UpdateAnyUserDeprecated(ctx context.Context, orgID valuer.UUID, deprecateUser *types.DeprecatedUser) error {
+func (module *setter) UpdateAnyUser(ctx context.Context, orgID valuer.UUID, deprecateUser *types.DeprecatedUser) error {
 	user := types.NewUserFromDeprecatedUser(deprecateUser)
 	if err := module.store.UpdateUser(ctx, orgID, user); err != nil {
 		return err
@@ -907,17 +801,13 @@ func (module *setter) activatePendingUser(ctx context.Context, user *types.User,
 
 func (module *setter) UpdateUserRoles(ctx context.Context, orgID, userID valuer.UUID, finalRoleNames []string) error {
 	return module.store.RunInTx(ctx, func(ctx context.Context) error {
-		// delete old user_role entries
+		// delete old user_role entries and create new ones from SSO
 		if err := module.userRoleStore.DeleteUserRoles(ctx, userID); err != nil {
 			return err
 		}
 
-		// create fresh ones only if there are roles to assign
-		if len(finalRoleNames) > 0 {
-			return module.createUserRoleEntries(ctx, orgID, userID, finalRoleNames)
-		}
-
-		return nil
+		// create fresh ones
+		return module.createUserRoleEntries(ctx, orgID, userID, finalRoleNames)
 	})
 }
 
@@ -930,33 +820,3 @@ func roleNamesFromUserRoles(userRoles []*authtypes.UserRole) []string {
 	}
 	return names
 }
-
-func (module *setter) patchRolesNames(currentRolesNames, targetRoleNames []string) ([]string, []string) {
-	currentRolesSet := make(map[string]struct{}, len(currentRolesNames))
-	targetRolesSet := make(map[string]struct{}, len(targetRoleNames))
-
-	for _, role := range currentRolesNames {
-		currentRolesSet[role] = struct{}{}
-	}
-	for _, role := range targetRoleNames {
-		targetRolesSet[role] = struct{}{}
-	}
-
-	// additions: roles present in input but not in current
-	additions := []string{}
-	for _, role := range targetRoleNames {
-		if _, exists := currentRolesSet[role]; !exists {
-			additions = append(additions, role)
-		}
-	}
-
-	// deletions: roles present in current but not in input
-	deletions := []string{}
-	for _, role := range currentRolesNames {
-		if _, exists := targetRolesSet[role]; !exists {
-			deletions = append(deletions, role)
-		}
-	}
-
-	return additions, deletions
-}

pkg/modules/user/impluser/store.go

@@ -667,22 +667,3 @@ func (store *store) GetUsersByEmailsOrgIDAndStatuses(ctx context.Context, orgID
 
 	return users, nil
 }
-
-func (store *store) GetUsersByOrgIDAndRoleID(ctx context.Context, orgID valuer.UUID, roleID valuer.UUID) ([]*types.User, error) {
-	users := []*types.User{}
-
-	err := store.
-		sqlstore.
-		BunDBCtx(ctx).
-		NewSelect().
-		Model(&users).
-		Join(`JOIN user_role ON user_role.user_id = "users".id`).
-		Where(`"users".org_id = ?`, orgID).
-		Where("user_role.role_id = ?", roleID).
-		Scan(ctx)
-	if err != nil {
-		return nil, err
-	}
-
-	return users, nil
-}

pkg/modules/user/user.go

@@ -34,13 +34,10 @@ type Setter interface {
 	// Initiate forgot password flow for a user
 	ForgotPassword(ctx context.Context, orgID valuer.UUID, email valuer.Email, frontendBaseURL string) error
 
-	UpdateUserDeprecated(ctx context.Context, orgID valuer.UUID, id string, user *types.DeprecatedUser, updatedBy string) (*types.DeprecatedUser, error)
-	UpdateMyUser(ctx context.Context, orgID valuer.UUID, userID valuer.UUID, updatable *types.UpdatableSelfUser) (*types.User, error)
-	UpdateUser(ctx context.Context, orgID valuer.UUID, userID valuer.UUID, updatable *types.UpdatableUser, updatedBy valuer.UUID) (*types.User, error)
+	UpdateUser(ctx context.Context, orgID valuer.UUID, id string, user *types.DeprecatedUser, updatedBy string) (*types.DeprecatedUser, error)
 
 	// UpdateAnyUser updates a user and persists the changes to the database along with the analytics and identity deletion.
-	UpdateAnyUserDeprecated(ctx context.Context, orgID valuer.UUID, deprecateUser *types.DeprecatedUser) error
-	UpdateAnyUser(ctx context.Context, orgID valuer.UUID, user *types.User) error
+	UpdateAnyUser(ctx context.Context, orgID valuer.UUID, user *types.DeprecatedUser) error
 	DeleteUser(ctx context.Context, orgID valuer.UUID, id string, deletedBy string) error
 
 	// invite
@@ -63,13 +60,11 @@ type Getter interface {
 	// Get root user by org id.
 	GetRootUserByOrgID(context.Context, valuer.UUID) (*types.User, []*authtypes.UserRole, error)
 
-	// Get gets the users based on the given org id
-	ListByOrgIDDeprecated(context.Context, valuer.UUID) ([]*types.DeprecatedUser, error)
-	ListByOrgID(ctx context.Context, orgID valuer.UUID) ([]*types.User, error)
+	// Get gets the users based on the given id
+	ListByOrgID(context.Context, valuer.UUID) ([]*types.DeprecatedUser, error)
 
 	// Get deprecated user object by orgID and id.
 	GetDeprecatedUserByOrgIDAndID(context.Context, valuer.UUID, valuer.UUID) (*types.DeprecatedUser, error)
-	GetUserByOrgIDAndID(ctx context.Context, orgID valuer.UUID, userID valuer.UUID) (*types.User, error)
 
 	// Get user by id.
 	Get(context.Context, valuer.UUID) (*types.DeprecatedUser, error)
@@ -91,9 +86,6 @@ type Getter interface {
 
 	// Gets user_role with roles entries from db
 	GetUserRoles(ctx context.Context, userID valuer.UUID) ([]*authtypes.UserRole, error)
-
-	// Gets all the user with role using role id in an org id
-	GetUsersByOrgIDAndRoleID(ctx context.Context, orgID valuer.UUID, roleID valuer.UUID) ([]*types.User, error)
 }
 
 type Handler interface {
@@ -101,19 +93,11 @@ type Handler interface {
 	CreateInvite(http.ResponseWriter, *http.Request)
 	CreateBulkInvite(http.ResponseWriter, *http.Request)
 
-	// users
-	ListUsersDeprecated(http.ResponseWriter, *http.Request)
 	ListUsers(http.ResponseWriter, *http.Request)
-	UpdateUserDeprecated(http.ResponseWriter, *http.Request)
 	UpdateUser(http.ResponseWriter, *http.Request)
 	DeleteUser(http.ResponseWriter, *http.Request)
-	GetUserDeprecated(http.ResponseWriter, *http.Request)
 	GetUser(http.ResponseWriter, *http.Request)
-	GetMyUserDeprecated(http.ResponseWriter, *http.Request)
 	GetMyUser(http.ResponseWriter, *http.Request)
-	UpdateMyUser(http.ResponseWriter, *http.Request)
-	GetUserRoles(http.ResponseWriter, *http.Request)
-	GetUsersByRoleID(http.ResponseWriter, *http.Request)
 
 	// Reset Password
 	GetResetPasswordToken(http.ResponseWriter, *http.Request)

pkg/statsreporter/analyticsstatsreporter/provider.go

@@ -178,7 +178,7 @@ func (provider *provider) Report(ctx context.Context) error {
 		}
 
 		for _, user := range users {
-			traits := types.NewTraitsFromUser(user)
+			traits := types.NewTraitsFromDeprecatedUser(user)
 			if maxLastObservedAt, ok := maxLastObservedAtPerUserID[user.ID]; ok {
 				traits["auth_token.last_observed_at.max.time"] = maxLastObservedAt.UTC()
 				traits["auth_token.last_observed_at.max.time_unix"] = maxLastObservedAt.Unix()

pkg/types/authtypes/user_role.go

@@ -5,14 +5,13 @@ import (
 	"time"
 
 	"github.com/SigNoz/signoz/pkg/errors"
-	"github.com/SigNoz/signoz/pkg/types"
 	"github.com/SigNoz/signoz/pkg/valuer"
 	"github.com/uptrace/bun"
 )
 
 var (
 	ErrCodeUserRoleAlreadyExists = errors.MustNewCode("user_role_already_exists")
-	ErrCodeUserRolesNotFound     = errors.MustNewCode("user_roles_not_found")
+	ErrCodeUserRolesNotFound      = errors.MustNewCode("user_roles_not_found")
 )
 
 type UserRole struct {
@@ -48,11 +47,6 @@ func NewUserRoles(userID valuer.UUID, roles []*Role) []*UserRole {
 	return userRoles
 }
 
-type UserWithRoles struct {
-	*types.User
-	Roles []*Role `json:"roles"`
-}
-
 type UserRoleStore interface {
 	// create user roles in bulk
 	CreateUserRoles(ctx context.Context, userRoles []*UserRole) error

pkg/types/user.go

@@ -51,15 +51,6 @@ type DeprecatedUser struct {
 	Role Role `json:"role"`
 }
 
-type UpdatableSelfUser struct {
-	DisplayName string `json:"displayName" required:"true"`
-}
-
-type UpdatableUser struct {
-	DisplayName string   `json:"displayName" required:"true"`
-	RoleNames   []string `json:"roleNames" required:"true" nullable:"false"`
-}
-
 type PostableRegisterOrgAndAdmin struct {
 	Name           string       `json:"name"`
 	Email          valuer.Email `json:"email"`
@@ -307,9 +298,6 @@ type UserStore interface {
 	// Get user by reset password token
 	GetUserByResetPasswordToken(ctx context.Context, token string) (*User, error)
 
-	// Get users having role by org id and role id
-	GetUsersByOrgIDAndRoleID(ctx context.Context, orgID valuer.UUID, roleID valuer.UUID) ([]*User, error)
-
 	// Transaction
 	RunInTx(ctx context.Context, cb func(ctx context.Context) error) error
 }