diff --git a/apps/console/src/features/roles/api/roles.ts b/apps/console/src/features/roles/api/roles.ts
index a897657dd0f..b9f5d7975bc 100644
--- a/apps/console/src/features/roles/api/roles.ts
+++ b/apps/console/src/features/roles/api/roles.ts
@@ -111,7 +111,7 @@ export const searchRoleList = (searchData: SearchRoleInterface): Promise<any> =>
  * Delete a selected role with a given role ID.
  *
  * @param roleId - Id of the role which needs to be deleted.
- * @returns `Promise<any>` a promise containing the status of the delete.
+ * @returns A promise containing the status of the delete.
  */
 export const deleteRoleById = (roleId: string): Promise<any> => {
     const requestConfig: RequestConfigInterface = {
@@ -183,7 +183,7 @@ export const updateRolePermissions = (roleId: string, data: unknown): Promise<an
 /**
  * Retrieve a list of all the permissions from the system.
  *
- * @returns `Promise<any>` a promise containing the permission list
+ * @returns A promise containing the permission list
  */
 export const getPermissionList = (): Promise<any> => {
     const requestConfig: RequestConfigInterface = {
@@ -256,7 +256,7 @@ export const updateRole = (roleId: string, roleData: PatchRoleDataInterface): Pr
  * TODO: Return `response.data` rather than `response` and stop returning any.
  *
  * @param domain - User store domain.
- * @returns `Promise<RoleListInterface | any>`
+ * @returns A promise containing the roles list.
  * @throws `IdentityAppsApiException`
  * @deprecated - Use `useRolesList` instead.
  */
@@ -303,7 +303,7 @@ export const getRolesList = (domain: string): Promise<RoleListInterface | any> =
  *
  * @param domain - User store domain.
  * @param filter - Search filter.
- * @returns `RequestResultInterface<Data=RoleListInterface, Error>`
+ * @returns The object containing the roles list.
  */
 export const useRolesList = <Data = RoleListInterface, Error = RequestErrorInterface>(
     domain: string,
@@ -312,6 +312,7 @@ export const useRolesList = <Data = RoleListInterface, Error = RequestErrorInter
 
     const requestConfig: RequestConfigInterface = {
         headers: {
+            Accept: "application/json",
             "Content-Type": "application/json"
         },
         method: HttpMethods.GET,
diff --git a/apps/console/src/features/roles/components/wizard-updated/role-basics.tsx b/apps/console/src/features/roles/components/wizard-updated/role-basics.tsx
index ca0efcd11aa..2fee3a9014d 100644
--- a/apps/console/src/features/roles/components/wizard-updated/role-basics.tsx
+++ b/apps/console/src/features/roles/components/wizard-updated/role-basics.tsx
@@ -16,7 +16,6 @@
  * under the License.
  */
 
-
 import { Alert, ListItemText } from "@oxygen-ui/react";
 import { IdentifiableComponentInterface } from "@wso2is/core/models";
 import { Field, Form } from "@wso2is/form";
@@ -50,7 +49,6 @@ const FORM_ID: string = "add-role-basics-form";
  * Interface to capture role basics props.
  */
 interface RoleBasicProps extends IdentifiableComponentInterface {
-    dummyProp?: string;
     /**
      * Initial values of the form.
      */
@@ -93,7 +91,6 @@ export const RoleBasics: FunctionComponent<RoleBasicProps> = (props: RoleBasicPr
     const [ applicationSearchQuery, setApplicationSearchQuery ] = useState<string>(undefined);
     const [ assignedApplicationsSearching, setAssignedApplicationsSearching ] = useState<boolean>(false);
     const [ applicationListOptions, setApplicationListOptions ] = useState<DropdownProps[]>([]);
-
     const noApplicationsAvailable: MutableRefObject<boolean> = useRef<boolean>(false);
 
     const {
@@ -104,11 +101,10 @@ export const RoleBasics: FunctionComponent<RoleBasicProps> = (props: RoleBasicPr
     } = useApplicationList("clientId", null, null, applicationSearchQuery);
 
     useEffect(() => {
-
         if (applicationListFetchRequestError) {
             setIsDisplayNoAppScopeApplicatioError(true);
             setIsDisplayApplicationList(false);
-            
+
             return;
         }
 
@@ -146,11 +142,7 @@ export const RoleBasics: FunctionComponent<RoleBasicProps> = (props: RoleBasicPr
             }
         });
 
-        if (options.length === 0) {
-            noApplicationsAvailable.current = true;
-        } else {
-            noApplicationsAvailable.current = false;
-        }
+        noApplicationsAvailable.current = (options.length === 0);
 
         setApplicationListOptions(options);
     }, [ applicationList ]);
@@ -183,7 +175,6 @@ export const RoleBasics: FunctionComponent<RoleBasicProps> = (props: RoleBasicPr
      */
     const searchApplications: DebouncedFunc<(query: string) => void> = 
         useCallback(debounce((query: string) => {
-            query = !isEmpty(query) ? query : null;
             setApplicationSearchQuery(query ? `name co ${query}` : null);
             mutateApplicationListFetchRequest().finally(() => {
                 setAssignedApplicationsSearching(false);