diff --git a/src/apps/admin/src/AdminApp.tsx b/src/apps/admin/src/AdminApp.tsx
index 564392814..e255dad1d 100644
--- a/src/apps/admin/src/AdminApp.tsx
+++ b/src/apps/admin/src/AdminApp.tsx
@@ -3,7 +3,7 @@ import { Outlet, Routes } from 'react-router-dom'
 
 import { routerContext, RouterContextData } from '~/libs/core'
 
-import { AdminAppContextProvider, Layout, SWRConfigProvider } from './lib'
+import { AdminAppContextProvider, LayoutProps, SWRConfigProvider, useLayout } from './lib'
 import { toolTitle } from './admin-app.routes'
 import './lib/styles/index.scss'
 
@@ -14,6 +14,7 @@ const AdminApp: FC = () => {
     const { getChildRoutes }: RouterContextData = useContext(routerContext)
     // eslint-disable-next-line react-hooks/exhaustive-deps -- missing dependency: getChildRoutes
     const childRoutes = useMemo(() => getChildRoutes(toolTitle), [])
+    const { Layout }: { Layout: FC<LayoutProps> } = useLayout()
 
     useEffect(() => {
         document.body.classList.add('admin-app')
diff --git a/src/apps/admin/src/admin-app.routes.tsx b/src/apps/admin/src/admin-app.routes.tsx
index a6f0023dd..b64649b3b 100644
--- a/src/apps/admin/src/admin-app.routes.tsx
+++ b/src/apps/admin/src/admin-app.routes.tsx
@@ -1,3 +1,4 @@
+import { baseDetailPath, createBadgePath } from '~/apps/gamification-admin'
 import { AppSubdomain, ToolTitle } from '~/config'
 import {
     lazyLoad,
@@ -9,12 +10,15 @@ import {
 
 import {
     billingAccountRouteId,
+    gamificationAdminRouteId,
     manageChallengeRouteId,
     manageReviewRouteId,
     permissionManagementRouteId,
+    platformRouteId,
     rootRoute,
     userManagementRouteId,
 } from './config/routes.config'
+import { platformSkillRouteId } from './platform/routes.config'
 
 const AdminApp: LazyLoadedComponent = lazyLoad(() => import('./AdminApp'))
 
@@ -107,6 +111,24 @@ const PermissionAddGroupMembersPage: LazyLoadedComponent = lazyLoad(
     'PermissionAddGroupMembersPage',
 )
 
+const Platform: LazyLoadedComponent = lazyLoad(() => import('./platform/Platform'))
+const SkillManagement: LazyLoadedComponent = lazyLoad(
+    () => import('./platform/skill-management/SkillManagement'),
+)
+const SkillManagementLandingPage: LazyLoadedComponent = lazyLoad(
+    () => import('./platform/skill-management/LandingPage'),
+    'LandingPage',
+)
+const BadgeDetailPage: LazyLoadedComponent = lazyLoad(
+    () => import('../../gamification-admin/src/pages/badge-detail/BadgeDetailPage'),
+)
+const BadgeListingPage: LazyLoadedComponent = lazyLoad(
+    () => import('../../gamification-admin/src/pages/badge-listing/BadgeListingPage'),
+)
+const CreateBadgePage: LazyLoadedComponent = lazyLoad(
+    () => import('../../gamification-admin/src/pages/create-badge/CreateBadgePage'),
+)
+
 export const toolTitle: string = ToolTitle.admin
 
 export const adminRoutes: ReadonlyArray<PlatformRoute> = [
@@ -256,6 +278,43 @@ export const adminRoutes: ReadonlyArray<PlatformRoute> = [
                 id: permissionManagementRouteId,
                 route: permissionManagementRouteId,
             },
+
+            // Platform Management Module
+            {
+                children: [
+                    {
+                        children: [
+                            {
+                                element: <SkillManagementLandingPage />,
+                                id: 'skills-landing-page',
+                                route: '',
+                            },
+                        ],
+                        element: <SkillManagement />,
+                        id: platformSkillRouteId,
+                        route: platformSkillRouteId,
+                    },
+                    {
+                        element: (
+                            <BadgeListingPage
+                                rootPage={`${rootRoute}/${platformRouteId}/${gamificationAdminRouteId}`}
+                            />
+                        ),
+                        route: gamificationAdminRouteId,
+                    },
+                    {
+                        element: <CreateBadgePage />,
+                        route: `${gamificationAdminRouteId}${createBadgePath}`,
+                    },
+                    {
+                        element: <BadgeDetailPage />,
+                        route: `${gamificationAdminRouteId}${baseDetailPath}/:id`,
+                    },
+                ],
+                element: <Platform />,
+                id: platformRouteId,
+                route: platformRouteId,
+            },
         ],
         domain: AppSubdomain.admin,
         element: <AdminApp />,
diff --git a/src/apps/admin/src/config/routes.config.ts b/src/apps/admin/src/config/routes.config.ts
index 080a79e7d..fe857eb00 100644
--- a/src/apps/admin/src/config/routes.config.ts
+++ b/src/apps/admin/src/config/routes.config.ts
@@ -13,3 +13,5 @@ export const manageReviewRouteId = 'review-management'
 export const userManagementRouteId = 'user-management'
 export const billingAccountRouteId = 'billing-account'
 export const permissionManagementRouteId = 'permission-management'
+export const gamificationAdminRouteId = 'gamification-admin'
+export const platformRouteId = 'platform'
diff --git a/src/apps/admin/src/lib/components/DialogEditUserEmail/DialogEditUserEmail.module.scss b/src/apps/admin/src/lib/components/DialogEditUserEmail/DialogEditUserEmail.module.scss
index 917d059dd..2104049c7 100644
--- a/src/apps/admin/src/lib/components/DialogEditUserEmail/DialogEditUserEmail.module.scss
+++ b/src/apps/admin/src/lib/components/DialogEditUserEmail/DialogEditUserEmail.module.scss
@@ -5,6 +5,13 @@
     position: relative;
 }
 
+.blockForm {
+    display: flex;
+    flex-direction: column;
+    gap: 20px;
+    position: relative;
+}
+
 .actionButtons {
     display: flex;
     justify-content: flex-end;
diff --git a/src/apps/admin/src/lib/components/DialogEditUserEmail/DialogEditUserEmail.tsx b/src/apps/admin/src/lib/components/DialogEditUserEmail/DialogEditUserEmail.tsx
index 81157ab45..1ea8baac3 100644
--- a/src/apps/admin/src/lib/components/DialogEditUserEmail/DialogEditUserEmail.tsx
+++ b/src/apps/admin/src/lib/components/DialogEditUserEmail/DialogEditUserEmail.tsx
@@ -67,7 +67,7 @@ export const DialogEditUserEmail: FC<Props> = (props: Props) => {
                     className={classNames(styles.container, props.className)}
                     onSubmit={handleSubmit(onSubmit)}
                 >
-                    <div>
+                    <div className={styles.blockForm}>
                         <InputText
                             type='text'
                             name='id'
diff --git a/src/apps/admin/src/lib/components/DialogEditUserSSOLogin/DialogEditUserSSOLogin.module.scss b/src/apps/admin/src/lib/components/DialogEditUserSSOLogin/DialogEditUserSSOLogin.module.scss
new file mode 100644
index 000000000..392567789
--- /dev/null
+++ b/src/apps/admin/src/lib/components/DialogEditUserSSOLogin/DialogEditUserSSOLogin.module.scss
@@ -0,0 +1,71 @@
+.modal {
+    width: 800px !important;
+}
+
+.container {
+    display: flex;
+    flex-direction: column;
+    gap: 20px;
+    position: relative;
+    align-items: flex-start;
+
+    th:first-child {
+        padding-left: 16px !important;
+    }
+}
+
+.tableCell {
+    white-space: break-spaces !important;
+    text-align: left !important;
+}
+
+.actionButtons {
+    display: flex;
+    justify-content: flex-end;
+    gap: 6px;
+    width: 100%;
+}
+
+.btnActions {
+    display: flex;
+    justify-content: flex-end;
+    gap: 6px;
+}
+
+.blockAction {
+    width: 120px;
+}
+
+.loadingSpinnerContainer {
+    position: relative;
+    height: 100px;
+
+    .spinner {
+        background: none;
+    }
+}
+
+.dialogLoadingSpinnerContainer {
+    position: absolute;
+    width: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    bottom: 0;
+    height: 64px;
+    left: 0;
+
+    .spinner {
+        background: none;
+    }
+}
+
+.desktopTable {
+    td {
+        vertical-align: middle;
+    }
+}
+
+.mobileTable {
+    width: 100%;
+}
diff --git a/src/apps/admin/src/lib/components/DialogEditUserSSOLogin/DialogEditUserSSOLogin.tsx b/src/apps/admin/src/lib/components/DialogEditUserSSOLogin/DialogEditUserSSOLogin.tsx
new file mode 100644
index 000000000..e26ccec11
--- /dev/null
+++ b/src/apps/admin/src/lib/components/DialogEditUserSSOLogin/DialogEditUserSSOLogin.tsx
@@ -0,0 +1,253 @@
+/**
+ * Dialog edit user groups.
+ */
+import { FC, useCallback, useMemo, useState } from 'react'
+import _ from 'lodash'
+import classNames from 'classnames'
+
+import {
+    BaseModal,
+    Button,
+    LoadingSpinner,
+    Table,
+    TableColumn,
+} from '~/libs/ui'
+import { useWindowSize, WindowSize } from '~/libs/shared'
+
+import {
+    MobileTableColumn,
+    SSOLoginProvider,
+    SSOUserLogin,
+    UserInfo,
+} from '../../models'
+import { useManageUserSSOLogin, useManageUserSSOLoginProps } from '../../hooks'
+import { FormAddSSOLogin } from '../FormAddSSOLogin'
+import { FormAddSSOLoginData } from '../../models/FormAddSSOLoginData.model'
+import { TableMobile } from '../common/TableMobile'
+
+import styles from './DialogEditUserSSOLogin.module.scss'
+
+interface Props {
+    className?: string
+    open: boolean
+    setOpen: (isOpen: boolean) => void
+    userInfo: UserInfo
+    providers: SSOLoginProvider[]
+}
+
+export const DialogEditUserSSOLogin: FC<Props> = (props: Props) => {
+    const { width: screenWidth }: WindowSize = useWindowSize()
+    const isTablet = useMemo(() => screenWidth <= 900, [screenWidth])
+    const {
+        ssoUserLogins,
+        isLoading: isFetching,
+        isAdding,
+        isRemoving,
+        doAddSSOUserLogin,
+        doUpdateSSOUserLogin,
+        doRemoveSSOUserLogin,
+    }: useManageUserSSOLoginProps = useManageUserSSOLogin(props.userInfo)
+    const isRemovingBool = useMemo(
+        () => _.some(isRemoving, value => value === true),
+        [isRemoving],
+    )
+    const isLoading = useMemo(
+        () => isFetching || isAdding || isRemovingBool,
+        [isFetching, isAdding, isRemovingBool],
+    )
+
+    const [showAddForm, setShowAddForm] = useState(false)
+    const [showEditForm, setShowEditForm] = useState<SSOUserLogin>()
+
+    const handleClose = useCallback(() => {
+        if (!isLoading) {
+            props.setOpen(false)
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [isLoading])
+    const columns = useMemo<TableColumn<SSOUserLogin>[]>(
+        () => [
+            {
+                className: styles.tableCell,
+                label: 'User ID',
+                propertyName: 'userId',
+                type: 'text',
+            },
+            {
+                className: styles.tableCell,
+                label: 'Name',
+                propertyName: 'name',
+                type: 'text',
+            },
+            {
+                className: styles.tableCell,
+                label: 'Provider',
+                propertyName: 'provider',
+                type: 'text',
+            },
+            {
+                className: styles.tableCell,
+                label: 'Email',
+                propertyName: 'email',
+                type: 'text',
+            },
+            {
+                className: styles.blockAction,
+                label: 'Actions',
+                renderer: (data: SSOUserLogin) => (
+                    <div className={styles.btnActions}>
+                        <Button
+                            primary
+                            variant='danger'
+                            label='Remove'
+                            onClick={function onClick() {
+                                doRemoveSSOUserLogin(data)
+                            }}
+                            disabled={isRemoving[data.provider]}
+                        />
+                        <Button
+                            primary
+                            label='Edit'
+                            onClick={function onClick() {
+                                setShowEditForm(data)
+                            }}
+                            disabled={isAdding}
+                        />
+                    </div>
+                ),
+                type: 'action',
+            },
+        ],
+        [isAdding, isRemoving, doRemoveSSOUserLogin],
+    )
+
+    const columnsMobile = useMemo<MobileTableColumn<SSOUserLogin>[][]>(
+        () => columns.map(column => {
+            if (column.label === 'Actions') {
+                return [
+                    {
+                        ...column,
+                        colSpan: 2,
+                        mobileType: 'last-value',
+                    },
+                ]
+            }
+
+            return [
+                {
+                    ...column,
+                    className: '',
+                    label: `${column.label as string} label`,
+                    mobileType: 'label',
+                    renderer: () => (
+                        <div>
+                            {column.label as string}
+                            :
+                        </div>
+                    ),
+                    type: 'element',
+                },
+                {
+                    ...column,
+                    mobileType: 'last-value',
+                },
+            ]
+        }),
+        [columns],
+    )
+
+    const cancelEditForm = useCallback(() => {
+        setShowEditForm(undefined)
+        setShowAddForm(false)
+    }, [setShowAddForm, setShowEditForm])
+
+    return (
+        <BaseModal
+            allowBodyScroll
+            blockScroll
+            title={`SSO Logins of ${props.userInfo.handle}`}
+            onClose={handleClose}
+            open={props.open}
+            focusTrapped={false}
+            classNames={{
+                modal: classNames(styles.modal),
+            }}
+        >
+            <div className={classNames(styles.container, props.className)}>
+                {isFetching ? (
+                    <div className={styles.loadingSpinnerContainer}>
+                        <LoadingSpinner className={styles.spinner} />
+                    </div>
+                ) : (
+                    <>
+                        {ssoUserLogins.length ? (
+                            <>
+                                {isTablet ? (
+                                    <TableMobile
+                                        columns={columnsMobile}
+                                        data={ssoUserLogins}
+                                        className={styles.mobileTable}
+                                    />
+                                ) : (
+                                    <Table
+                                        columns={columns}
+                                        data={ssoUserLogins}
+                                        disableSorting
+                                        onToggleSort={_.noop}
+                                        className={styles.desktopTable}
+                                    />
+                                )}
+                            </>
+                        ) : (
+                            <div>No SSO logins</div>
+                        )}
+                    </>
+                )}
+
+                {showAddForm || showEditForm ? (
+                    <FormAddSSOLogin
+                        isAdding={isAdding}
+                        onSubmit={function onSubmit(data: FormAddSSOLoginData) {
+                            if (showAddForm) {
+                                doAddSSOUserLogin(data, cancelEditForm)
+                            } else {
+                                doUpdateSSOUserLogin(data, cancelEditForm)
+                            }
+                        }}
+                        onCancel={cancelEditForm}
+                        providers={props.providers}
+                        editingData={showEditForm}
+                    />
+                ) : (
+                    <Button
+                        primary
+                        type='submit'
+                        onClick={function onClick() {
+                            setShowAddForm(true)
+                        }}
+                    >
+                        Add
+                    </Button>
+                )}
+                <div className={styles.actionButtons}>
+                    <Button
+                        secondary
+                        size='lg'
+                        onClick={handleClose}
+                        disabled={isLoading}
+                    >
+                        Close
+                    </Button>
+                </div>
+
+                {(isAdding || isRemovingBool) && (
+                    <div className={styles.dialogLoadingSpinnerContainer}>
+                        <LoadingSpinner className={styles.spinner} />
+                    </div>
+                )}
+            </div>
+        </BaseModal>
+    )
+}
+
+export default DialogEditUserSSOLogin
diff --git a/src/apps/admin/src/lib/components/DialogEditUserSSOLogin/index.ts b/src/apps/admin/src/lib/components/DialogEditUserSSOLogin/index.ts
new file mode 100644
index 000000000..5c5b5b91d
--- /dev/null
+++ b/src/apps/admin/src/lib/components/DialogEditUserSSOLogin/index.ts
@@ -0,0 +1 @@
+export { default as DialogEditUserSSOLogin } from './DialogEditUserSSOLogin'
diff --git a/src/apps/admin/src/lib/components/FormAddSSOLogin/FormAddSSOLogin.module.scss b/src/apps/admin/src/lib/components/FormAddSSOLogin/FormAddSSOLogin.module.scss
new file mode 100644
index 000000000..e20915d75
--- /dev/null
+++ b/src/apps/admin/src/lib/components/FormAddSSOLogin/FormAddSSOLogin.module.scss
@@ -0,0 +1,13 @@
+.container {
+    display: flex;
+    flex-direction: column;
+    gap: 20px;
+    position: relative;
+    width: 100%;
+}
+
+.actionButtons {
+    display: flex;
+    justify-content: flex-end;
+    gap: 6px;
+}
diff --git a/src/apps/admin/src/lib/components/FormAddSSOLogin/FormAddSSOLogin.tsx b/src/apps/admin/src/lib/components/FormAddSSOLogin/FormAddSSOLogin.tsx
new file mode 100644
index 000000000..289b41cee
--- /dev/null
+++ b/src/apps/admin/src/lib/components/FormAddSSOLogin/FormAddSSOLogin.tsx
@@ -0,0 +1,173 @@
+/**
+ * Form Add SSO Login.
+ */
+import { FC, useCallback, useEffect, useMemo } from 'react'
+import {
+    Controller,
+    ControllerRenderProps,
+    useForm,
+    UseFormReturn,
+} from 'react-hook-form'
+import _ from 'lodash'
+import classNames from 'classnames'
+
+import { Button, InputSelectReact, InputText } from '~/libs/ui'
+import { yupResolver } from '@hookform/resolvers/yup'
+
+import { FormAddSSOLoginData } from '../../models/FormAddSSOLoginData.model'
+import { SSOLoginProvider, SSOUserLogin } from '../../models'
+import { formAddSSOLoginSchema } from '../../utils'
+
+import styles from './FormAddSSOLogin.module.scss'
+
+interface Props {
+    className?: string
+    isAdding: boolean
+    onSubmit: (data: FormAddSSOLoginData) => void
+    onCancel: () => void
+    providers: SSOLoginProvider[]
+    editingData?: SSOUserLogin
+}
+
+export const FormAddSSOLogin: FC<Props> = (props: Props) => {
+    const isEditing = !!props.editingData
+    const providerOptions = useMemo(
+        () => props.providers.map(item => ({
+            label: item.name,
+            value: item.name,
+        })),
+        [props.providers],
+    )
+    const {
+        register,
+        handleSubmit,
+        control,
+        reset,
+        formState: { errors, isValid, isDirty },
+    }: UseFormReturn<FormAddSSOLoginData> = useForm({
+        defaultValues: {
+            email: '',
+            name: '',
+            provider: '',
+            userId: '',
+        },
+        mode: 'all',
+        resolver: yupResolver(formAddSSOLoginSchema),
+    })
+    const onSubmit = useCallback(
+        (data: FormAddSSOLoginData) => {
+            props.onSubmit(data)
+        },
+        [props.onSubmit],
+    )
+
+    useEffect(() => {
+        if (props.editingData) {
+            reset({
+                email: props.editingData.email,
+                name: props.editingData.name,
+                provider: props.editingData.provider,
+                userId: props.editingData.userId,
+            })
+        }
+    }, [props.editingData])
+
+    return (
+        <form
+            className={classNames(styles.container, props.className)}
+            onSubmit={handleSubmit(onSubmit)}
+        >
+            <span>
+                {isEditing ? 'Edit' : 'Add'}
+                {' '}
+                SSO Login
+            </span>
+            <div>
+                <InputText
+                    type='text'
+                    name='userId'
+                    label='User Id'
+                    placeholder='Enter'
+                    tabIndex={0}
+                    forceUpdateValue
+                    onChange={_.noop}
+                    error={_.get(errors, 'userId.message')}
+                    inputControl={register('userId')}
+                    dirty
+                    disabled={props.isAdding}
+                />
+                <InputText
+                    type='text'
+                    name='name'
+                    label='Name'
+                    placeholder='Enter'
+                    tabIndex={0}
+                    forceUpdateValue
+                    onChange={_.noop}
+                    error={_.get(errors, 'name.message')}
+                    inputControl={register('name')}
+                    dirty
+                    disabled={props.isAdding}
+                />
+                <Controller
+                    name='provider'
+                    control={control}
+                    render={function render(controlProps: {
+                        field: ControllerRenderProps<
+                            FormAddSSOLoginData,
+                            'provider'
+                        >
+                    }) {
+                        return (
+                            <InputSelectReact
+                                name='provider'
+                                label='Provider'
+                                placeholder='Select'
+                                options={providerOptions}
+                                value={controlProps.field.value}
+                                onChange={controlProps.field.onChange}
+                                classNameWrapper={styles.inputField}
+                                disabled={props.isAdding || isEditing}
+                                dirty
+                                error={_.get(errors, 'provider.message')}
+                            />
+                        )
+                    }}
+                />
+                <InputText
+                    type='text'
+                    name='email'
+                    label='Email'
+                    placeholder='Enter'
+                    tabIndex={0}
+                    forceUpdateValue
+                    onChange={_.noop}
+                    error={_.get(errors, 'email.message')}
+                    inputControl={register('email')}
+                    dirty
+                    disabled={props.isAdding}
+                />
+            </div>
+            <div className={styles.actionButtons}>
+                <Button
+                    secondary
+                    size='lg'
+                    onClick={props.onCancel}
+                    disabled={props.isAdding}
+                >
+                    Cancel
+                </Button>
+                <Button
+                    type='submit'
+                    primary
+                    size='lg'
+                    disabled={props.isAdding || !isValid || !isDirty}
+                >
+                    Save
+                </Button>
+            </div>
+        </form>
+    )
+}
+
+export default FormAddSSOLogin
diff --git a/src/apps/admin/src/lib/components/FormAddSSOLogin/index.ts b/src/apps/admin/src/lib/components/FormAddSSOLogin/index.ts
new file mode 100644
index 000000000..6a538903b
--- /dev/null
+++ b/src/apps/admin/src/lib/components/FormAddSSOLogin/index.ts
@@ -0,0 +1 @@
+export { default as FormAddSSOLogin } from './FormAddSSOLogin'
diff --git a/src/apps/admin/src/lib/components/UsersTable/UsersTable.tsx b/src/apps/admin/src/lib/components/UsersTable/UsersTable.tsx
index 4ae53a4cf..aa65b2dee 100644
--- a/src/apps/admin/src/lib/components/UsersTable/UsersTable.tsx
+++ b/src/apps/admin/src/lib/components/UsersTable/UsersTable.tsx
@@ -21,15 +21,18 @@ import { CopyButton } from '../CopyButton'
 import { DialogEditUserEmail } from '../DialogEditUserEmail'
 import { DialogEditUserRoles } from '../DialogEditUserRoles'
 import { DialogEditUserGroups } from '../DialogEditUserGroups'
+import { DialogEditUserSSOLogin } from '../DialogEditUserSSOLogin'
 import { DialogEditUserTerms } from '../DialogEditUserTerms'
 import { DialogEditUserStatus } from '../DialogEditUserStatus'
 import { DialogUserStatusHistory } from '../DialogUserStatusHistory'
 import { DropdownMenuButton } from '../common/DropdownMenuButton'
-import { useTableFilterLocal, useTableFilterLocalProps } from '../../hooks'
+import { useOnComponentDidMount, useTableFilterLocal, useTableFilterLocalProps } from '../../hooks'
 import { TABLE_DATE_FORMAT } from '../../../config/index.config'
-import { UserInfo } from '../../models'
+import { SSOLoginProvider, UserInfo } from '../../models'
 import { Pagination } from '../common/Pagination'
 import { ReactComponent as RectangleListRegularIcon } from '../../assets/i/rectangle-list-regular-icon.svg'
+import { fetchSSOLoginProviders } from '../../services'
+import { handleError } from '../../utils'
 
 import styles from './UsersTable.module.scss'
 
@@ -47,6 +50,7 @@ interface Props {
 
 export const UsersTable: FC<Props> = props => {
     const [colWidth, setColWidth] = useState<colWidthType>({})
+    const [ssoLoginProviders, setSsoLoginProviders] = useState<SSOLoginProvider[]>([])
     const [showDialogEditUserEmail, setShowDialogEditUserEmail] = useState<
         UserInfo | undefined
     >()
@@ -56,6 +60,9 @@ export const UsersTable: FC<Props> = props => {
     const [showDialogEditUserGroups, setShowDialogEditUserGroups] = useState<
         UserInfo | undefined
     >()
+    const [showDialogEditUserSSOLogin, setShowDialogEditSSOLogin] = useState<
+        UserInfo | undefined
+    >()
     const [showDialogEditUserTerms, setShowDialogEditUserTerms] = useState<
         UserInfo | undefined
     >()
@@ -273,6 +280,8 @@ export const UsersTable: FC<Props> = props => {
                             setShowDialogEditUserGroups(data)
                         } else if (item === 'Terms') {
                             setShowDialogEditUserTerms(data)
+                        } else if (item === 'SSO Logins') {
+                            setShowDialogEditSSOLogin(data)
                         } else if (item === 'Deactivate') {
                             setShowDialogEditUserStatus(data)
                         } else if (item === 'Activate') {
@@ -298,6 +307,7 @@ export const UsersTable: FC<Props> = props => {
                                         'Roles',
                                         'Groups',
                                         'Terms',
+                                        'SSO Logins',
                                         ...(data.active
                                             ? ['Deactivate']
                                             : ['Activate']),
@@ -318,6 +328,7 @@ export const UsersTable: FC<Props> = props => {
                                             'Roles',
                                             'Groups',
                                             'Terms',
+                                            'SSO Logins',
                                         ]}
                                         onSelectOption={onSelectOption}
                                     >
@@ -359,6 +370,16 @@ export const UsersTable: FC<Props> = props => {
         [isTablet, isMobile],
     )
 
+    useOnComponentDidMount(() => {
+        fetchSSOLoginProviders()
+            .then(result => {
+                setSsoLoginProviders(result)
+            })
+            .catch(e => {
+                handleError(e)
+            })
+    })
+
     return (
         <div className={classNames(styles.container, props.className)}>
             <Table
@@ -406,6 +427,16 @@ export const UsersTable: FC<Props> = props => {
                     userInfo={showDialogEditUserGroups}
                 />
             )}
+            {showDialogEditUserSSOLogin && (
+                <DialogEditUserSSOLogin
+                    open
+                    setOpen={function setOpen() {
+                        setShowDialogEditSSOLogin(undefined)
+                    }}
+                    userInfo={showDialogEditUserSSOLogin}
+                    providers={ssoLoginProviders}
+                />
+            )}
             {showDialogEditUserTerms && (
                 <DialogEditUserTerms
                     open
diff --git a/src/apps/admin/src/lib/components/common/Layout/Layout.module.scss b/src/apps/admin/src/lib/components/common/Layout/Layout.module.scss
index 283bc6d49..73d0aadb6 100644
--- a/src/apps/admin/src/lib/components/common/Layout/Layout.module.scss
+++ b/src/apps/admin/src/lib/components/common/Layout/Layout.module.scss
@@ -13,6 +13,15 @@
         @include ltelg {
             padding: $sp-4;
         }
+
+        &.isPlatformPage {
+            padding: 0;
+            background-color: white;
+
+            @include ltelg {
+                padding: 0;
+            }
+        }
     }
 }
 
@@ -20,7 +29,24 @@
     margin: $sp-8 auto !important;
 }
 
-.contantentLayoutInner {
+.contentLayoutInner {
     box-sizing: border-box;
     width: 100%;
 }
+
+/* --- PLATFORM SKILLS LAYOUT --- */
+
+.platformSkillsContentLayout {
+    color: $black-100;
+
+    .layout {
+        .main {
+            padding: 0 0 $sp-6;
+            background-color: $tc-white;
+
+            @include ltelg {
+                padding: $sp-4 0;
+            }
+        }
+    }
+}
diff --git a/src/apps/admin/src/lib/components/common/Layout/Layout.tsx b/src/apps/admin/src/lib/components/common/Layout/Layout.tsx
index 3e249d083..e9fd0fe26 100644
--- a/src/apps/admin/src/lib/components/common/Layout/Layout.tsx
+++ b/src/apps/admin/src/lib/components/common/Layout/Layout.tsx
@@ -1,28 +1,80 @@
-import { FC, PropsWithChildren } from 'react'
+import { FC, PropsWithChildren, useContext } from 'react'
+import cn from 'classnames'
 
+import { platformRouteId } from '~/apps/admin/src/config/routes.config'
 import { ContentLayout } from '~/libs/ui'
+import { routerContext, RouterContextData } from '~/libs/core'
+import { platformSkillRouteId } from '~/apps/admin/src/platform/routes.config'
+import { AppSubdomain, EnvironmentConfig } from '~/config'
 
 import { SystemAdminTabs } from '../Tab'
 
 import styles from './Layout.module.scss'
 
-export const NullLayout: FC<PropsWithChildren> = props => (
-    <>{props.children}</>
-)
+export const NullLayout: FC<PropsWithChildren> = props => <>{props.children}</>
+
+export type LayoutProps = PropsWithChildren<{
+    classes?: { // eslint-disable-line react/no-unused-prop-types -- it's actually used
+        contentClass?: string
+        innerClass?: string
+        outerClass?: string
+        layoutClass?: string
+        mainClass?: string
+    }
+}>
 
-export const Layout: FC<PropsWithChildren> = props => (
+export const Layout: FC<LayoutProps> = props => (
     <ContentLayout
-        innerClass={styles.contantentLayoutInner}
-        outerClass={styles.contentLayoutOuter}
+        contentClass={cn(styles.contentLayout, props.classes?.contentClass)}
+        innerClass={cn(styles.contentLayoutInner, props.classes?.innerClass)}
+        outerClass={cn(styles.contentLayoutOuter, props.classes?.outerClass)}
     >
-        <div className={styles.layout}>
+        <div className={cn(styles.layout, props.classes?.layoutClass)}>
             <SystemAdminTabs />
 
-            <div className={styles.main}>
+            <div className={cn(styles.main, props.classes?.mainClass)}>
                 {props.children}
             </div>
         </div>
     </ContentLayout>
 )
 
+export const PlatformLayout: FC<LayoutProps> = props => (
+    <Layout classes={{ mainClass: styles.isPlatformPage }}>
+        {props.children}
+    </Layout>
+)
+
+export const PlatformSkillsLayout: FC<LayoutProps> = props => (
+    <Layout classes={{ contentClass: styles.platformSkillsContentLayout }}>
+        {props.children}
+    </Layout>
+)
+
+export function useLayout(): { Layout: FC<LayoutProps> } {
+    const routerContextData: RouterContextData = useContext(routerContext)
+
+    if (!routerContextData.initialized) return { Layout }
+
+    const platformBaseRouteId = EnvironmentConfig.SUBDOMAIN === AppSubdomain.admin
+        ? `/${platformRouteId}`
+        : `/${AppSubdomain.admin}/${platformRouteId}`
+
+    const skillManagementRouteId = EnvironmentConfig.SUBDOMAIN === AppSubdomain.admin
+        ? `/${platformRouteId}/${platformSkillRouteId}`
+        : `/${AppSubdomain.admin}/${platformRouteId}/${platformSkillRouteId}`
+
+    if (window.location.pathname.toLowerCase()
+        .startsWith(skillManagementRouteId.toLowerCase())) {
+        return { Layout: PlatformSkillsLayout }
+    }
+
+    if (window.location.pathname.toLowerCase()
+        .startsWith(platformBaseRouteId.toLowerCase())) {
+        return { Layout: PlatformLayout }
+    }
+
+    return { Layout }
+}
+
 export default Layout
diff --git a/src/apps/admin/src/lib/components/common/Tab/config/system-admin-tabs-config.ts b/src/apps/admin/src/lib/components/common/Tab/config/system-admin-tabs-config.ts
index fe9bbbeb2..b3f1b0de2 100644
--- a/src/apps/admin/src/lib/components/common/Tab/config/system-admin-tabs-config.ts
+++ b/src/apps/admin/src/lib/components/common/Tab/config/system-admin-tabs-config.ts
@@ -3,11 +3,14 @@ import _ from 'lodash'
 import { TabsNavItem } from '~/libs/ui'
 import {
     billingAccountRouteId,
+    gamificationAdminRouteId,
     manageChallengeRouteId,
     manageReviewRouteId,
     permissionManagementRouteId,
+    platformRouteId,
     userManagementRouteId,
 } from '~/apps/admin/src/config/routes.config'
+import { platformSkillRouteId } from '~/apps/admin/src/platform/routes.config'
 
 export const SystemAdminTabsConfig: TabsNavItem[] = [
     {
@@ -50,6 +53,22 @@ export const SystemAdminTabsConfig: TabsNavItem[] = [
         id: permissionManagementRouteId,
         title: 'Permission Management',
     },
+    {
+        children: [
+            {
+
+                id: `${platformRouteId}/${platformSkillRouteId}`,
+                title: 'Skills',
+            },
+            {
+                id: `${platformRouteId}/${gamificationAdminRouteId}`,
+                title: 'Badges',
+
+            },
+        ],
+        id: platformRouteId,
+        title: 'Platform',
+    },
 ]
 
 export function getTabIdFromPathName(pathname: string): string {
diff --git a/src/apps/admin/src/lib/hooks/index.ts b/src/apps/admin/src/lib/hooks/index.ts
index c96c3ac3a..d0fc0d901 100644
--- a/src/apps/admin/src/lib/hooks/index.ts
+++ b/src/apps/admin/src/lib/hooks/index.ts
@@ -25,3 +25,4 @@ export * from './useManagePermissionGroupMembers'
 export * from './useSearchUserInfo'
 export * from './useManageBusEvent'
 export * from './useManageChallengeSubmissions'
+export * from './useManageUserSSOLogin'
diff --git a/src/apps/admin/src/lib/hooks/useManageUserSSOLogin.ts b/src/apps/admin/src/lib/hooks/useManageUserSSOLogin.ts
new file mode 100644
index 000000000..4a0ef5c58
--- /dev/null
+++ b/src/apps/admin/src/lib/hooks/useManageUserSSOLogin.ts
@@ -0,0 +1,343 @@
+/**
+ * Manage sso user logins redux state
+ */
+import { useCallback, useReducer } from 'react'
+import { toast } from 'react-toastify'
+import _ from 'lodash'
+
+import { FormAddSSOLoginData } from '../models/FormAddSSOLoginData.model'
+import { SSOLoginProvider, SSOUserLogin, UserInfo } from '../models'
+import {
+    createSSOUserLogin,
+    deleteSSOUserLogin,
+    fetchSSOLoginProviders,
+    fetchSSOUserLogins,
+    updateSSOUserLogin,
+} from '../services'
+import { handleError } from '../utils'
+
+import { useOnComponentDidMount } from './useOnComponentDidMount'
+
+/// /////////////////
+// SSO user logins reducer
+/// ////////////////
+
+type SSOUserLoginsState = {
+    isLoading: boolean
+    isAdding: boolean
+    providers: SSOLoginProvider[]
+    ssoUserLogins: SSOUserLogin[]
+    isRemoving: { [key: string]: boolean }
+}
+
+const SSOUserLoginsActionType = {
+    ADD_SSO_USER_LOGIN_DONE: 'ADD_SSO_USER_LOGIN_DONE' as const,
+    ADD_SSO_USER_LOGIN_FAILED: 'ADD_SSO_USER_LOGIN_FAILED' as const,
+    ADD_SSO_USER_LOGIN_INIT: 'ADD_SSO_USER_LOGIN_INIT' as const,
+    FETCH_SSO_USER_LOGINS_DONE: 'FETCH_SSO_USER_LOGINS_DONE' as const,
+    FETCH_SSO_USER_LOGINS_FAILED: 'FETCH_SSO_USER_LOGINS_FAILED' as const,
+    FETCH_SSO_USER_LOGINS_INIT: 'FETCH_SSO_USER_LOGINS_INIT' as const,
+    REMOVE_SSO_USER_LOGIN_DONE: 'REMOVE_SSO_USER_LOGIN_DONE' as const,
+    REMOVE_SSO_USER_LOGIN_FAILED: 'REMOVE_SSO_USER_LOGIN_FAILED' as const,
+    REMOVE_SSO_USER_LOGIN_INIT: 'REMOVE_SSO_USER_LOGIN_INIT' as const,
+    UPDATE_SSO_USER_LOGIN_DONE: 'UPDATE_SSO_USER_LOGIN_DONE' as const,
+    UPDATE_SSO_USER_LOGIN_FAILED: 'UPDATE_SSO_USER_LOGIN_FAILED' as const,
+    UPDATE_SSO_USER_LOGIN_INIT: 'UPDATE_SSO_USER_LOGIN_INIT' as const,
+}
+
+type SSOUserLoginsReducerAction =
+    | {
+          type:
+              | typeof SSOUserLoginsActionType.ADD_SSO_USER_LOGIN_INIT
+              | typeof SSOUserLoginsActionType.ADD_SSO_USER_LOGIN_FAILED
+              | typeof SSOUserLoginsActionType.FETCH_SSO_USER_LOGINS_INIT
+              | typeof SSOUserLoginsActionType.FETCH_SSO_USER_LOGINS_FAILED
+              | typeof SSOUserLoginsActionType.UPDATE_SSO_USER_LOGIN_INIT
+              | typeof SSOUserLoginsActionType.UPDATE_SSO_USER_LOGIN_FAILED
+      }
+    | {
+          type: typeof SSOUserLoginsActionType.FETCH_SSO_USER_LOGINS_DONE
+          payload: {
+              ssoUserLogins: SSOUserLogin[]
+              providers: SSOLoginProvider[]
+          }
+      }
+    | {
+          type:
+              | typeof SSOUserLoginsActionType.ADD_SSO_USER_LOGIN_DONE
+              | typeof SSOUserLoginsActionType.UPDATE_SSO_USER_LOGIN_DONE
+          payload: SSOUserLogin
+      }
+    | {
+          type:
+              | typeof SSOUserLoginsActionType.REMOVE_SSO_USER_LOGIN_DONE
+              | typeof SSOUserLoginsActionType.REMOVE_SSO_USER_LOGIN_INIT
+              | typeof SSOUserLoginsActionType.REMOVE_SSO_USER_LOGIN_FAILED
+          payload: string
+      }
+
+const reducer = (
+    previousState: SSOUserLoginsState,
+    action: SSOUserLoginsReducerAction,
+): SSOUserLoginsState => {
+    switch (action.type) {
+        case SSOUserLoginsActionType.FETCH_SSO_USER_LOGINS_INIT: {
+            return {
+                ...previousState,
+                isLoading: true,
+                ssoUserLogins: [],
+            }
+        }
+
+        case SSOUserLoginsActionType.FETCH_SSO_USER_LOGINS_DONE: {
+            return {
+                ...previousState,
+                isLoading: false,
+                providers: action.payload.providers,
+                ssoUserLogins: action.payload.ssoUserLogins,
+            }
+        }
+
+        case SSOUserLoginsActionType.FETCH_SSO_USER_LOGINS_FAILED: {
+            return {
+                ...previousState,
+                isLoading: false,
+            }
+        }
+
+        case SSOUserLoginsActionType.ADD_SSO_USER_LOGIN_INIT: {
+            return {
+                ...previousState,
+                isAdding: true,
+            }
+        }
+
+        case SSOUserLoginsActionType.ADD_SSO_USER_LOGIN_DONE: {
+            return {
+                ...previousState,
+                isAdding: false,
+                ssoUserLogins: [...previousState.ssoUserLogins, action.payload],
+            }
+        }
+
+        case SSOUserLoginsActionType.ADD_SSO_USER_LOGIN_FAILED: {
+            return {
+                ...previousState,
+                isAdding: false,
+            }
+        }
+
+        case SSOUserLoginsActionType.UPDATE_SSO_USER_LOGIN_INIT: {
+            return {
+                ...previousState,
+                isAdding: true,
+            }
+        }
+
+        case SSOUserLoginsActionType.UPDATE_SSO_USER_LOGIN_DONE: {
+            return {
+                ...previousState,
+                isAdding: false,
+                ssoUserLogins: previousState.ssoUserLogins.map(
+                    item => (item.provider === action.payload.provider
+                        ? action.payload
+                        : item),
+                ),
+            }
+        }
+
+        case SSOUserLoginsActionType.UPDATE_SSO_USER_LOGIN_FAILED: {
+            return {
+                ...previousState,
+                isAdding: false,
+            }
+        }
+
+        case SSOUserLoginsActionType.REMOVE_SSO_USER_LOGIN_INIT: {
+            return {
+                ...previousState,
+                isRemoving: {
+                    ...previousState.isRemoving,
+                    [action.payload]: true,
+                },
+            }
+        }
+
+        case SSOUserLoginsActionType.REMOVE_SSO_USER_LOGIN_DONE: {
+            const ssoUserLogins = _.filter(
+                previousState.ssoUserLogins,
+                item => item.provider !== action.payload,
+            )
+            return {
+                ...previousState,
+                isRemoving: {
+                    ...previousState.isRemoving,
+                    [action.payload]: false,
+                },
+                ssoUserLogins,
+            }
+        }
+
+        case SSOUserLoginsActionType.REMOVE_SSO_USER_LOGIN_FAILED: {
+            return {
+                ...previousState,
+                isRemoving: {
+                    ...previousState.isRemoving,
+                    [action.payload]: false,
+                },
+            }
+        }
+
+        default: {
+            return previousState
+        }
+    }
+}
+
+export interface useManageUserSSOLoginProps {
+    isLoading: boolean
+    isRemoving: { [key: string]: boolean }
+    isAdding: boolean
+    ssoUserLogins: SSOUserLogin[]
+    doAddSSOUserLogin: (
+        formData: FormAddSSOLoginData,
+        onSuccess: () => void,
+    ) => void
+    doUpdateSSOUserLogin: (
+        formData: FormAddSSOLoginData,
+        onSuccess: () => void,
+    ) => void
+    doRemoveSSOUserLogin: (ssoUserLogin: SSOUserLogin) => void
+}
+
+/**
+ * Manage sso user logins redux state
+ * @param userInfo user info
+ * @returns state data
+ */
+export function useManageUserSSOLogin(
+    userInfo: UserInfo,
+): useManageUserSSOLoginProps {
+    const [state, dispatch] = useReducer(reducer, {
+        isAdding: false,
+        isLoading: false,
+        isRemoving: {},
+        providers: [],
+        ssoUserLogins: [],
+    })
+
+    const doFetchSSOUserLogins = useCallback(() => {
+        dispatch({
+            type: SSOUserLoginsActionType.FETCH_SSO_USER_LOGINS_INIT,
+        })
+        Promise.all([fetchSSOUserLogins(userInfo.id), fetchSSOLoginProviders()])
+            .then(result => {
+                dispatch({
+                    payload: {
+                        providers: result[1],
+                        ssoUserLogins: result[0],
+                    },
+                    type: SSOUserLoginsActionType.FETCH_SSO_USER_LOGINS_DONE,
+                })
+            })
+            .catch(e => {
+                dispatch({
+                    type: SSOUserLoginsActionType.FETCH_SSO_USER_LOGINS_FAILED,
+                })
+                handleError(e)
+            })
+    }, [dispatch, userInfo])
+
+    const doAddSSOUserLogin = useCallback(
+        (formData: FormAddSSOLoginData, onSuccess: () => void) => {
+            dispatch({
+                type: SSOUserLoginsActionType.ADD_SSO_USER_LOGIN_INIT,
+            })
+            createSSOUserLogin(userInfo.id, formData)
+                .then(result => {
+                    toast.success('SSO login added successfully', {
+                        toastId: 'Add sso login',
+                    })
+                    dispatch({
+                        payload: result,
+                        type: SSOUserLoginsActionType.ADD_SSO_USER_LOGIN_DONE,
+                    })
+                    onSuccess()
+                })
+                .catch(e => {
+                    dispatch({
+                        type: SSOUserLoginsActionType.ADD_SSO_USER_LOGIN_FAILED,
+                    })
+                    handleError(e)
+                })
+        },
+        [dispatch, userInfo],
+    )
+
+    const doUpdateSSOUserLogin = useCallback(
+        (formData: FormAddSSOLoginData, onSuccess: () => void) => {
+            dispatch({
+                type: SSOUserLoginsActionType.UPDATE_SSO_USER_LOGIN_INIT,
+            })
+            updateSSOUserLogin(userInfo.id, formData)
+                .then(result => {
+                    toast.success('SSO login updated successfully', {
+                        toastId: 'Update sso login',
+                    })
+                    dispatch({
+                        payload: result,
+                        type: SSOUserLoginsActionType.UPDATE_SSO_USER_LOGIN_DONE,
+                    })
+                    onSuccess()
+                })
+                .catch(e => {
+                    dispatch({
+                        type: SSOUserLoginsActionType.UPDATE_SSO_USER_LOGIN_FAILED,
+                    })
+                    handleError(e)
+                })
+        },
+        [dispatch, userInfo],
+    )
+
+    const doRemoveSSOUserLogin = useCallback(
+        (ssoUserLogin: SSOUserLogin) => {
+            dispatch({
+                payload: ssoUserLogin.provider,
+                type: SSOUserLoginsActionType.REMOVE_SSO_USER_LOGIN_INIT,
+            })
+            deleteSSOUserLogin(userInfo.id, ssoUserLogin.provider)
+                .then(() => {
+                    toast.success('SSO login removed successfully', {
+                        toastId: 'Remove sso login',
+                    })
+                    dispatch({
+                        payload: ssoUserLogin.provider,
+                        type: SSOUserLoginsActionType.REMOVE_SSO_USER_LOGIN_DONE,
+                    })
+                })
+                .catch(e => {
+                    dispatch({
+                        payload: ssoUserLogin.provider,
+                        type: SSOUserLoginsActionType.REMOVE_SSO_USER_LOGIN_FAILED,
+                    })
+                    handleError(e)
+                })
+        },
+        [dispatch, userInfo],
+    )
+
+    useOnComponentDidMount(() => {
+        doFetchSSOUserLogins()
+    })
+
+    return {
+        doAddSSOUserLogin,
+        doRemoveSSOUserLogin,
+        doUpdateSSOUserLogin,
+        isAdding: state.isAdding,
+        isLoading: state.isLoading,
+        isRemoving: state.isRemoving,
+        ssoUserLogins: state.ssoUserLogins,
+    }
+}
diff --git a/src/apps/admin/src/lib/models/FormAddSSOLoginData.model.ts b/src/apps/admin/src/lib/models/FormAddSSOLoginData.model.ts
new file mode 100644
index 000000000..0ce1ea9c7
--- /dev/null
+++ b/src/apps/admin/src/lib/models/FormAddSSOLoginData.model.ts
@@ -0,0 +1,9 @@
+/**
+ * Model for add sso login data
+ */
+export interface FormAddSSOLoginData {
+    userId: string
+    name: string
+    email: string
+    provider: string
+}
diff --git a/src/apps/admin/src/lib/models/SSOLoginProvider.model.ts b/src/apps/admin/src/lib/models/SSOLoginProvider.model.ts
new file mode 100644
index 000000000..f3f75c17f
--- /dev/null
+++ b/src/apps/admin/src/lib/models/SSOLoginProvider.model.ts
@@ -0,0 +1,8 @@
+/**
+ * Model for sso login provider
+ */
+export interface SSOLoginProvider {
+    ssoLoginProviderId: number
+    name: string
+    type: string
+}
diff --git a/src/apps/admin/src/lib/models/SSOUserLogin.model.ts b/src/apps/admin/src/lib/models/SSOUserLogin.model.ts
new file mode 100644
index 000000000..c80e19f01
--- /dev/null
+++ b/src/apps/admin/src/lib/models/SSOUserLogin.model.ts
@@ -0,0 +1,14 @@
+/**
+ * Model for sso user login
+ */
+export interface SSOUserLogin {
+    userId: string
+    name: string
+    email: string
+    providerType: string
+    provider: string
+    context: any
+    social: boolean
+    enterprise: boolean
+    emailVerified: boolean
+}
diff --git a/src/apps/admin/src/lib/models/index.ts b/src/apps/admin/src/lib/models/index.ts
index 786d0dc93..d85a6e63a 100644
--- a/src/apps/admin/src/lib/models/index.ts
+++ b/src/apps/admin/src/lib/models/index.ts
@@ -33,6 +33,8 @@ export * from './RoleMemberInfo.model'
 export * from './Submission.model'
 export * from './RequestBusAPI.model'
 export * from './MemberSubmission.model'
+export * from './SSOUserLogin.model'
+export * from './SSOLoginProvider.model'
 export * from './FormAddGroupMembers.type'
 export * from './TableFilterType.type'
 export * from './TableRolesFilter.type'
diff --git a/src/apps/admin/src/lib/services/user.service.ts b/src/apps/admin/src/lib/services/user.service.ts
index 73920a830..4f1dcab54 100644
--- a/src/apps/admin/src/lib/services/user.service.ts
+++ b/src/apps/admin/src/lib/services/user.service.ts
@@ -1,15 +1,18 @@
 import _ from 'lodash'
 
 import { EnvironmentConfig } from '~/config'
-import { xhrGetAsync, xhrPatchAsync } from '~/libs/core'
+import { xhrDeleteAsync, xhrGetAsync, xhrPatchAsync, xhrPostAsync, xhrPutAsync } from '~/libs/core'
 
 import {
     adjustUserInfoResponse,
     adjustUserStatusHistoryResponse,
     ApiV3Response,
+    SSOLoginProvider,
+    SSOUserLogin,
     UserInfo,
     UserStatusHistory,
 } from '../models'
+import { FormAddSSOLoginData } from '../models/FormAddSSOLoginData.model'
 
 /**
  * Gets the member suggest by handle.
@@ -154,3 +157,84 @@ export const findUserById = async (userId: string | number): Promise<UserInfo> =
     )
     return adjustUserInfoResponse(result.result.content)
 }
+
+/**
+ * Fetch list of sso user login.
+ * @param userId user id.
+ * @returns resolves to sso user logins
+ */
+export const fetchSSOUserLogins = async (userId: string | number): Promise<SSOUserLogin[]> => {
+    const result = await xhrGetAsync<ApiV3Response<SSOUserLogin[]>>(
+        `${EnvironmentConfig.API.V3}/users/${userId}/SSOUserLogins`,
+    )
+    return result.result.content
+}
+
+/**
+ * Fetch list of sso login provider.
+ * @returns resolves to sso user logins
+ */
+export const fetchSSOLoginProviders = async (): Promise<SSOLoginProvider[]> => {
+    const result = await xhrGetAsync<ApiV3Response<SSOLoginProvider[]>>(
+        `${EnvironmentConfig.API.V3}/ssoLoginProviders`,
+    )
+    return result.result.content
+}
+
+/**
+ * Create sso user login.
+ * @param userId user id.
+ * @param userLogin user login info.
+ * @returns resolves to sso user login
+ */
+export const createSSOUserLogin = async (
+    userId: string | number,
+    userLogin: FormAddSSOLoginData,
+): Promise<SSOUserLogin> => {
+    const result = await xhrPostAsync<
+        {
+            param: FormAddSSOLoginData
+        },
+        ApiV3Response<SSOUserLogin>
+    >(`${EnvironmentConfig.API.V3}/users/${userId}/SSOUserLogin`, {
+        param: userLogin,
+    })
+    return result.result.content
+}
+
+/**
+ * Update sso user login.
+ * @param userId user id.
+ * @param userLogin user login info.
+ * @returns resolves to sso user login
+ */
+export const updateSSOUserLogin = async (
+    userId: string | number,
+    userLogin: FormAddSSOLoginData,
+): Promise<SSOUserLogin> => {
+    const result = await xhrPutAsync<
+        {
+            param: FormAddSSOLoginData
+        },
+        ApiV3Response<SSOUserLogin>
+    >(`${EnvironmentConfig.API.V3}/users/${userId}/SSOUserLogin`, {
+        param: userLogin,
+    })
+    return result.result.content
+}
+
+/**
+ * Delete sso user login.
+ * @param userId user id.
+ * @param provider login provider.
+ * @returns resolves to sso user login
+ */
+export const deleteSSOUserLogin = async (
+    userId: string | number,
+    provider: string,
+): Promise<SSOUserLogin> => {
+    const result = await xhrDeleteAsync<ApiV3Response<SSOUserLogin>>(
+        `${EnvironmentConfig.API.V3}/users/${userId}/SSOUserLogin?provider=${provider}`,
+    )
+    return result.result.content
+}
diff --git a/src/apps/admin/src/lib/utils/validation.ts b/src/apps/admin/src/lib/utils/validation.ts
index 89e34212a..051761582 100644
--- a/src/apps/admin/src/lib/utils/validation.ts
+++ b/src/apps/admin/src/lib/utils/validation.ts
@@ -20,6 +20,7 @@ import {
 } from '../models'
 import { FormEditUserStatus } from '../models/FormEditUserStatus.model'
 import { FormAddRoleMembers } from '../models/FormAddRoleMembers.type'
+import { FormAddSSOLoginData } from '../models/FormAddSSOLoginData.model'
 
 /**
  * validation schema for form filter users
@@ -366,6 +367,26 @@ export const formEditUserEmailSchema: Yup.ObjectSchema<FormEditUserEmail>
             .required('Email address is required.'),
     })
 
+/**
+ * validation schema for form edit sso user login
+ */
+export const formAddSSOLoginSchema: Yup.ObjectSchema<FormAddSSOLoginData>
+    = Yup.object({
+        email: Yup.string()
+            .trim()
+            .email('Invalid email address.')
+            .required('Email address is required.'),
+        name: Yup.string()
+            .trim()
+            .required('Name is required.'),
+        provider: Yup.string()
+            .trim()
+            .required('Provider is required.'),
+        userId: Yup.string()
+            .trim()
+            .required('User id is required.'),
+    })
+
 /**
  * validation schema for form add group
  */
diff --git a/src/apps/admin/src/platform-management/PlatformManagement.tsx b/src/apps/admin/src/platform-management/PlatformManagement.tsx
new file mode 100644
index 000000000..e662b61c8
--- /dev/null
+++ b/src/apps/admin/src/platform-management/PlatformManagement.tsx
@@ -0,0 +1,34 @@
+import { FC, useContext, useMemo } from 'react'
+import { Outlet, Routes } from 'react-router-dom'
+
+import { routerContext, RouterContextData } from '~/libs/core'
+
+import { adminRoutes } from '../admin-app.routes'
+import { platformRouteId } from '../config/routes.config'
+
+/**
+ * The router outlet.
+ */
+export const PlatformManagement: FC = () => {
+    const childRoutes = useChildRoutes()
+
+    return (
+        <>
+            <Outlet />
+            <Routes>{childRoutes}</Routes>
+        </>
+    )
+}
+
+function useChildRoutes(): Array<JSX.Element> | undefined {
+    const { getRouteElement }: RouterContextData = useContext(routerContext)
+    const childRoutes = useMemo(
+        () => adminRoutes[0].children
+            ?.find(r => r.id === platformRouteId)
+            ?.children?.map(getRouteElement),
+        [], // eslint-disable-line react-hooks/exhaustive-deps -- missing dependency: getRouteElement
+    )
+    return childRoutes
+}
+
+export default PlatformManagement
diff --git a/src/apps/admin/src/platform/Platform.tsx b/src/apps/admin/src/platform/Platform.tsx
new file mode 100644
index 000000000..7990772f3
--- /dev/null
+++ b/src/apps/admin/src/platform/Platform.tsx
@@ -0,0 +1,37 @@
+/**
+ * Wrapper for permission managment
+ */
+import { FC, useContext, useMemo } from 'react'
+import { Outlet, Routes } from 'react-router-dom'
+
+import { routerContext, RouterContextData } from '~/libs/core'
+
+import { adminRoutes } from '../admin-app.routes'
+import { platformRouteId } from '../config/routes.config'
+
+/**
+ * The router outlet with layout.
+ */
+export const Platform: FC = () => {
+    const childRoutes = useChildRoutes()
+
+    return (
+        <>
+            <Outlet />
+            <Routes>{childRoutes}</Routes>
+        </>
+    )
+}
+
+function useChildRoutes(): Array<JSX.Element> | undefined {
+    const { getRouteElement }: RouterContextData = useContext(routerContext)
+    const childRoutes = useMemo(
+        () => adminRoutes[0].children
+            ?.find(r => r.id === platformRouteId)
+            ?.children?.map(getRouteElement),
+        [], // eslint-disable-line react-hooks/exhaustive-deps -- missing dependency: getRouteElement
+    )
+    return childRoutes
+}
+
+export default Platform
diff --git a/src/apps/admin/src/platform/routes.config.ts b/src/apps/admin/src/platform/routes.config.ts
new file mode 100644
index 000000000..4a95b6fe8
--- /dev/null
+++ b/src/apps/admin/src/platform/routes.config.ts
@@ -0,0 +1 @@
+export const platformSkillRouteId = 'skills'
diff --git a/src/apps/skills-manager/src/skills-manager/landing-page/LandingPage.module.scss b/src/apps/admin/src/platform/skill-management/LandingPage/LandingPage.module.scss
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/landing-page/LandingPage.module.scss
rename to src/apps/admin/src/platform/skill-management/LandingPage/LandingPage.module.scss
diff --git a/src/apps/skills-manager/src/skills-manager/landing-page/LandingPage.tsx b/src/apps/admin/src/platform/skill-management/LandingPage/LandingPage.tsx
similarity index 88%
rename from src/apps/skills-manager/src/skills-manager/landing-page/LandingPage.tsx
rename to src/apps/admin/src/platform/skill-management/LandingPage/LandingPage.tsx
index 3400b27f7..ca5c0487c 100644
--- a/src/apps/skills-manager/src/skills-manager/landing-page/LandingPage.tsx
+++ b/src/apps/admin/src/platform/skill-management/LandingPage/LandingPage.tsx
@@ -1,8 +1,8 @@
 import { FC } from 'react'
 
-import { ContentLayout, InputCheckbox, PageTitle } from '~/libs/ui'
+import { InputCheckbox, PageTitle } from '~/libs/ui'
 
-import { SkillsManagerContextValue, useSkillsManagerContext } from '../context'
+import { SkillsManagerContextValue, useSkillsManagerContext } from '../lib/context'
 import {
     CategoriesAccordion,
     CategoryModal,
@@ -10,8 +10,8 @@ import {
     PageHeader,
     SearchInput,
     SkillModal,
-} from '../components'
-import { BulkEditor } from '../components/bulk-editor'
+} from '../lib/components'
+import { BulkEditor } from '../lib/components/bulk-editor'
 
 import styles from './LandingPage.module.scss'
 
@@ -30,7 +30,7 @@ const LandingPage: FC<{}> = () => {
     }: SkillsManagerContextValue = useSkillsManagerContext()
 
     return (
-        <ContentLayout innerClass={styles.contentWrap}>
+        <div className={styles.contentWrap}>
             <PageTitle>Skills Manager | Admin</PageTitle>
             <PageHeader title='Skills Manager'>
                 <InputCheckbox
@@ -63,7 +63,7 @@ const LandingPage: FC<{}> = () => {
             )}
 
             {!!showSkillModal && <SkillModal skill={showSkillModal} />}
-        </ContentLayout>
+        </div>
     )
 }
 
diff --git a/src/apps/skills-manager/src/skills-manager/landing-page/index.ts b/src/apps/admin/src/platform/skill-management/LandingPage/index.ts
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/landing-page/index.ts
rename to src/apps/admin/src/platform/skill-management/LandingPage/index.ts
diff --git a/src/apps/admin/src/platform/skill-management/SkillManagement.tsx b/src/apps/admin/src/platform/skill-management/SkillManagement.tsx
new file mode 100644
index 000000000..6e66d9795
--- /dev/null
+++ b/src/apps/admin/src/platform/skill-management/SkillManagement.tsx
@@ -0,0 +1,38 @@
+import { FC, useContext, useMemo } from 'react'
+import { Outlet, Routes } from 'react-router-dom'
+
+import { routerContext, RouterContextData } from '~/libs/core'
+
+import { adminRoutes } from '../../admin-app.routes'
+import { platformRouteId } from '../../config/routes.config'
+import { platformSkillRouteId } from '../routes.config'
+
+import { SkillsManagerContext } from './lib/context'
+
+/**
+ * The router outlet.
+ */
+export const PlatformManagement: FC = () => {
+    const childRoutes = useChildRoutes()
+
+    return (
+        <SkillsManagerContext>
+            <Outlet />
+            <Routes>{childRoutes}</Routes>
+        </SkillsManagerContext>
+    )
+}
+
+function useChildRoutes(): Array<JSX.Element> | undefined {
+    const { getRouteElement }: RouterContextData = useContext(routerContext)
+    const childRoutes = useMemo(
+        () => adminRoutes[0].children
+            ?.find(r => r.id === platformRouteId)
+            ?.children?.find(r => r.id === platformSkillRouteId)
+            ?.children?.map(getRouteElement),
+        [], // eslint-disable-line react-hooks/exhaustive-deps -- missing dependency: getRouteElement
+    )
+    return childRoutes
+}
+
+export default PlatformManagement
diff --git a/src/apps/skills-manager/src/skills-manager/components/accordion/Accordion.module.scss b/src/apps/admin/src/platform/skill-management/lib/components/accordion/Accordion.module.scss
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/accordion/Accordion.module.scss
rename to src/apps/admin/src/platform/skill-management/lib/components/accordion/Accordion.module.scss
diff --git a/src/apps/skills-manager/src/skills-manager/components/accordion/Accordion.tsx b/src/apps/admin/src/platform/skill-management/lib/components/accordion/Accordion.tsx
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/accordion/Accordion.tsx
rename to src/apps/admin/src/platform/skill-management/lib/components/accordion/Accordion.tsx
diff --git a/src/apps/skills-manager/src/skills-manager/components/accordion/accordion-item/AccordionItem.module.scss b/src/apps/admin/src/platform/skill-management/lib/components/accordion/accordion-item/AccordionItem.module.scss
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/accordion/accordion-item/AccordionItem.module.scss
rename to src/apps/admin/src/platform/skill-management/lib/components/accordion/accordion-item/AccordionItem.module.scss
diff --git a/src/apps/skills-manager/src/skills-manager/components/accordion/accordion-item/AccordionItem.tsx b/src/apps/admin/src/platform/skill-management/lib/components/accordion/accordion-item/AccordionItem.tsx
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/accordion/accordion-item/AccordionItem.tsx
rename to src/apps/admin/src/platform/skill-management/lib/components/accordion/accordion-item/AccordionItem.tsx
diff --git a/src/apps/skills-manager/src/skills-manager/components/accordion/accordion-item/index.ts b/src/apps/admin/src/platform/skill-management/lib/components/accordion/accordion-item/index.ts
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/accordion/accordion-item/index.ts
rename to src/apps/admin/src/platform/skill-management/lib/components/accordion/accordion-item/index.ts
diff --git a/src/apps/skills-manager/src/skills-manager/components/accordion/index.ts b/src/apps/admin/src/platform/skill-management/lib/components/accordion/index.ts
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/accordion/index.ts
rename to src/apps/admin/src/platform/skill-management/lib/components/accordion/index.ts
diff --git a/src/apps/skills-manager/src/skills-manager/components/actions-menu/ActionsMenu.module.scss b/src/apps/admin/src/platform/skill-management/lib/components/actions-menu/ActionsMenu.module.scss
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/actions-menu/ActionsMenu.module.scss
rename to src/apps/admin/src/platform/skill-management/lib/components/actions-menu/ActionsMenu.module.scss
diff --git a/src/apps/skills-manager/src/skills-manager/components/actions-menu/ActionsMenu.tsx b/src/apps/admin/src/platform/skill-management/lib/components/actions-menu/ActionsMenu.tsx
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/actions-menu/ActionsMenu.tsx
rename to src/apps/admin/src/platform/skill-management/lib/components/actions-menu/ActionsMenu.tsx
diff --git a/src/apps/skills-manager/src/skills-manager/components/actions-menu/index.ts b/src/apps/admin/src/platform/skill-management/lib/components/actions-menu/index.ts
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/actions-menu/index.ts
rename to src/apps/admin/src/platform/skill-management/lib/components/actions-menu/index.ts
diff --git a/src/apps/skills-manager/src/skills-manager/components/bulk-editor/BulkEditor.module.scss b/src/apps/admin/src/platform/skill-management/lib/components/bulk-editor/BulkEditor.module.scss
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/bulk-editor/BulkEditor.module.scss
rename to src/apps/admin/src/platform/skill-management/lib/components/bulk-editor/BulkEditor.module.scss
diff --git a/src/apps/skills-manager/src/skills-manager/components/bulk-editor/BulkEditor.tsx b/src/apps/admin/src/platform/skill-management/lib/components/bulk-editor/BulkEditor.tsx
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/bulk-editor/BulkEditor.tsx
rename to src/apps/admin/src/platform/skill-management/lib/components/bulk-editor/BulkEditor.tsx
diff --git a/src/apps/skills-manager/src/skills-manager/components/bulk-editor/archive-skills-modal/ArchiveSkillsModal.module.scss b/src/apps/admin/src/platform/skill-management/lib/components/bulk-editor/archive-skills-modal/ArchiveSkillsModal.module.scss
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/bulk-editor/archive-skills-modal/ArchiveSkillsModal.module.scss
rename to src/apps/admin/src/platform/skill-management/lib/components/bulk-editor/archive-skills-modal/ArchiveSkillsModal.module.scss
diff --git a/src/apps/skills-manager/src/skills-manager/components/bulk-editor/archive-skills-modal/ArchiveSkillsModal.tsx b/src/apps/admin/src/platform/skill-management/lib/components/bulk-editor/archive-skills-modal/ArchiveSkillsModal.tsx
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/bulk-editor/archive-skills-modal/ArchiveSkillsModal.tsx
rename to src/apps/admin/src/platform/skill-management/lib/components/bulk-editor/archive-skills-modal/ArchiveSkillsModal.tsx
diff --git a/src/apps/skills-manager/src/skills-manager/components/bulk-editor/archive-skills-modal/index.ts b/src/apps/admin/src/platform/skill-management/lib/components/bulk-editor/archive-skills-modal/index.ts
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/bulk-editor/archive-skills-modal/index.ts
rename to src/apps/admin/src/platform/skill-management/lib/components/bulk-editor/archive-skills-modal/index.ts
diff --git a/src/apps/skills-manager/src/skills-manager/components/bulk-editor/index.ts b/src/apps/admin/src/platform/skill-management/lib/components/bulk-editor/index.ts
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/bulk-editor/index.ts
rename to src/apps/admin/src/platform/skill-management/lib/components/bulk-editor/index.ts
diff --git a/src/apps/skills-manager/src/skills-manager/components/bulk-editor/move-skills-modal/MoveSkillsModal.module.scss b/src/apps/admin/src/platform/skill-management/lib/components/bulk-editor/move-skills-modal/MoveSkillsModal.module.scss
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/bulk-editor/move-skills-modal/MoveSkillsModal.module.scss
rename to src/apps/admin/src/platform/skill-management/lib/components/bulk-editor/move-skills-modal/MoveSkillsModal.module.scss
diff --git a/src/apps/skills-manager/src/skills-manager/components/bulk-editor/move-skills-modal/MoveSkillsModal.tsx b/src/apps/admin/src/platform/skill-management/lib/components/bulk-editor/move-skills-modal/MoveSkillsModal.tsx
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/bulk-editor/move-skills-modal/MoveSkillsModal.tsx
rename to src/apps/admin/src/platform/skill-management/lib/components/bulk-editor/move-skills-modal/MoveSkillsModal.tsx
diff --git a/src/apps/skills-manager/src/skills-manager/components/bulk-editor/move-skills-modal/index.ts b/src/apps/admin/src/platform/skill-management/lib/components/bulk-editor/move-skills-modal/index.ts
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/bulk-editor/move-skills-modal/index.ts
rename to src/apps/admin/src/platform/skill-management/lib/components/bulk-editor/move-skills-modal/index.ts
diff --git a/src/apps/skills-manager/src/skills-manager/components/bulk-editor/replace-skills-modal/ReplaceSkillsModal.module.scss b/src/apps/admin/src/platform/skill-management/lib/components/bulk-editor/replace-skills-modal/ReplaceSkillsModal.module.scss
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/bulk-editor/replace-skills-modal/ReplaceSkillsModal.module.scss
rename to src/apps/admin/src/platform/skill-management/lib/components/bulk-editor/replace-skills-modal/ReplaceSkillsModal.module.scss
diff --git a/src/apps/skills-manager/src/skills-manager/components/bulk-editor/replace-skills-modal/ReplaceSkillsModal.tsx b/src/apps/admin/src/platform/skill-management/lib/components/bulk-editor/replace-skills-modal/ReplaceSkillsModal.tsx
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/bulk-editor/replace-skills-modal/ReplaceSkillsModal.tsx
rename to src/apps/admin/src/platform/skill-management/lib/components/bulk-editor/replace-skills-modal/ReplaceSkillsModal.tsx
diff --git a/src/apps/skills-manager/src/skills-manager/components/bulk-editor/replace-skills-modal/index.ts b/src/apps/admin/src/platform/skill-management/lib/components/bulk-editor/replace-skills-modal/index.ts
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/bulk-editor/replace-skills-modal/index.ts
rename to src/apps/admin/src/platform/skill-management/lib/components/bulk-editor/replace-skills-modal/index.ts
diff --git a/src/apps/skills-manager/src/skills-manager/components/bulk-editor/search-skill-input/SearchSkillInput.tsx b/src/apps/admin/src/platform/skill-management/lib/components/bulk-editor/search-skill-input/SearchSkillInput.tsx
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/bulk-editor/search-skill-input/SearchSkillInput.tsx
rename to src/apps/admin/src/platform/skill-management/lib/components/bulk-editor/search-skill-input/SearchSkillInput.tsx
diff --git a/src/apps/skills-manager/src/skills-manager/components/bulk-editor/search-skill-input/index.ts b/src/apps/admin/src/platform/skill-management/lib/components/bulk-editor/search-skill-input/index.ts
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/bulk-editor/search-skill-input/index.ts
rename to src/apps/admin/src/platform/skill-management/lib/components/bulk-editor/search-skill-input/index.ts
diff --git a/src/apps/skills-manager/src/skills-manager/components/categories-accordion/CategoriesAccordion.module.scss b/src/apps/admin/src/platform/skill-management/lib/components/categories-accordion/CategoriesAccordion.module.scss
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/categories-accordion/CategoriesAccordion.module.scss
rename to src/apps/admin/src/platform/skill-management/lib/components/categories-accordion/CategoriesAccordion.module.scss
diff --git a/src/apps/skills-manager/src/skills-manager/components/categories-accordion/CategoriesAccordion.tsx b/src/apps/admin/src/platform/skill-management/lib/components/categories-accordion/CategoriesAccordion.tsx
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/categories-accordion/CategoriesAccordion.tsx
rename to src/apps/admin/src/platform/skill-management/lib/components/categories-accordion/CategoriesAccordion.tsx
diff --git a/src/apps/skills-manager/src/skills-manager/components/categories-accordion/index.ts b/src/apps/admin/src/platform/skill-management/lib/components/categories-accordion/index.ts
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/categories-accordion/index.ts
rename to src/apps/admin/src/platform/skill-management/lib/components/categories-accordion/index.ts
diff --git a/src/apps/skills-manager/src/skills-manager/components/category-modal/CategoryModal.module.scss b/src/apps/admin/src/platform/skill-management/lib/components/category-modal/CategoryModal.module.scss
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/category-modal/CategoryModal.module.scss
rename to src/apps/admin/src/platform/skill-management/lib/components/category-modal/CategoryModal.module.scss
diff --git a/src/apps/skills-manager/src/skills-manager/components/category-modal/CategoryModal.tsx b/src/apps/admin/src/platform/skill-management/lib/components/category-modal/CategoryModal.tsx
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/category-modal/CategoryModal.tsx
rename to src/apps/admin/src/platform/skill-management/lib/components/category-modal/CategoryModal.tsx
diff --git a/src/apps/skills-manager/src/skills-manager/components/category-modal/category-form.config.ts b/src/apps/admin/src/platform/skill-management/lib/components/category-modal/category-form.config.ts
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/category-modal/category-form.config.ts
rename to src/apps/admin/src/platform/skill-management/lib/components/category-modal/category-form.config.ts
diff --git a/src/apps/skills-manager/src/skills-manager/components/category-modal/index.ts b/src/apps/admin/src/platform/skill-management/lib/components/category-modal/index.ts
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/category-modal/index.ts
rename to src/apps/admin/src/platform/skill-management/lib/components/category-modal/index.ts
diff --git a/src/apps/skills-manager/src/skills-manager/components/index.ts b/src/apps/admin/src/platform/skill-management/lib/components/index.ts
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/index.ts
rename to src/apps/admin/src/platform/skill-management/lib/components/index.ts
diff --git a/src/apps/skills-manager/src/skills-manager/components/more-actions-menu/MoreActionsMenu.module.scss b/src/apps/admin/src/platform/skill-management/lib/components/more-actions-menu/MoreActionsMenu.module.scss
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/more-actions-menu/MoreActionsMenu.module.scss
rename to src/apps/admin/src/platform/skill-management/lib/components/more-actions-menu/MoreActionsMenu.module.scss
diff --git a/src/apps/skills-manager/src/skills-manager/components/more-actions-menu/MoreActionsMenu.tsx b/src/apps/admin/src/platform/skill-management/lib/components/more-actions-menu/MoreActionsMenu.tsx
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/more-actions-menu/MoreActionsMenu.tsx
rename to src/apps/admin/src/platform/skill-management/lib/components/more-actions-menu/MoreActionsMenu.tsx
diff --git a/src/apps/skills-manager/src/skills-manager/components/more-actions-menu/index.ts b/src/apps/admin/src/platform/skill-management/lib/components/more-actions-menu/index.ts
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/more-actions-menu/index.ts
rename to src/apps/admin/src/platform/skill-management/lib/components/more-actions-menu/index.ts
diff --git a/src/apps/skills-manager/src/skills-manager/components/page-header/PageHeader.module.scss b/src/apps/admin/src/platform/skill-management/lib/components/page-header/PageHeader.module.scss
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/page-header/PageHeader.module.scss
rename to src/apps/admin/src/platform/skill-management/lib/components/page-header/PageHeader.module.scss
diff --git a/src/apps/skills-manager/src/skills-manager/components/page-header/PageHeader.tsx b/src/apps/admin/src/platform/skill-management/lib/components/page-header/PageHeader.tsx
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/page-header/PageHeader.tsx
rename to src/apps/admin/src/platform/skill-management/lib/components/page-header/PageHeader.tsx
diff --git a/src/apps/skills-manager/src/skills-manager/components/page-header/index.ts b/src/apps/admin/src/platform/skill-management/lib/components/page-header/index.ts
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/page-header/index.ts
rename to src/apps/admin/src/platform/skill-management/lib/components/page-header/index.ts
diff --git a/src/apps/skills-manager/src/skills-manager/components/search-input/SearchInput.module.scss b/src/apps/admin/src/platform/skill-management/lib/components/search-input/SearchInput.module.scss
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/search-input/SearchInput.module.scss
rename to src/apps/admin/src/platform/skill-management/lib/components/search-input/SearchInput.module.scss
diff --git a/src/apps/skills-manager/src/skills-manager/components/search-input/SearchInput.tsx b/src/apps/admin/src/platform/skill-management/lib/components/search-input/SearchInput.tsx
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/search-input/SearchInput.tsx
rename to src/apps/admin/src/platform/skill-management/lib/components/search-input/SearchInput.tsx
diff --git a/src/apps/skills-manager/src/skills-manager/components/search-input/index.ts b/src/apps/admin/src/platform/skill-management/lib/components/search-input/index.ts
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/search-input/index.ts
rename to src/apps/admin/src/platform/skill-management/lib/components/search-input/index.ts
diff --git a/src/apps/skills-manager/src/skills-manager/components/skill-modals/SkillModal.module.scss b/src/apps/admin/src/platform/skill-management/lib/components/skill-modals/SkillModal.module.scss
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/skill-modals/SkillModal.module.scss
rename to src/apps/admin/src/platform/skill-management/lib/components/skill-modals/SkillModal.module.scss
diff --git a/src/apps/skills-manager/src/skills-manager/components/skill-modals/SkillModal.tsx b/src/apps/admin/src/platform/skill-management/lib/components/skill-modals/SkillModal.tsx
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/skill-modals/SkillModal.tsx
rename to src/apps/admin/src/platform/skill-management/lib/components/skill-modals/SkillModal.tsx
diff --git a/src/apps/skills-manager/src/skills-manager/components/skill-modals/index.ts b/src/apps/admin/src/platform/skill-management/lib/components/skill-modals/index.ts
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/skill-modals/index.ts
rename to src/apps/admin/src/platform/skill-management/lib/components/skill-modals/index.ts
diff --git a/src/apps/skills-manager/src/skills-manager/components/skill-modals/similar-skills-dropdown/SimilarSkillsDropdown.module.scss b/src/apps/admin/src/platform/skill-management/lib/components/skill-modals/similar-skills-dropdown/SimilarSkillsDropdown.module.scss
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/skill-modals/similar-skills-dropdown/SimilarSkillsDropdown.module.scss
rename to src/apps/admin/src/platform/skill-management/lib/components/skill-modals/similar-skills-dropdown/SimilarSkillsDropdown.module.scss
diff --git a/src/apps/skills-manager/src/skills-manager/components/skill-modals/similar-skills-dropdown/SimilarSkillsDropdown.tsx b/src/apps/admin/src/platform/skill-management/lib/components/skill-modals/similar-skills-dropdown/SimilarSkillsDropdown.tsx
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/skill-modals/similar-skills-dropdown/SimilarSkillsDropdown.tsx
rename to src/apps/admin/src/platform/skill-management/lib/components/skill-modals/similar-skills-dropdown/SimilarSkillsDropdown.tsx
diff --git a/src/apps/skills-manager/src/skills-manager/components/skill-modals/similar-skills-dropdown/index.ts b/src/apps/admin/src/platform/skill-management/lib/components/skill-modals/similar-skills-dropdown/index.ts
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/skill-modals/similar-skills-dropdown/index.ts
rename to src/apps/admin/src/platform/skill-management/lib/components/skill-modals/similar-skills-dropdown/index.ts
diff --git a/src/apps/skills-manager/src/skills-manager/components/skill-modals/skill-form/SkillForm.module.scss b/src/apps/admin/src/platform/skill-management/lib/components/skill-modals/skill-form/SkillForm.module.scss
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/skill-modals/skill-form/SkillForm.module.scss
rename to src/apps/admin/src/platform/skill-management/lib/components/skill-modals/skill-form/SkillForm.module.scss
diff --git a/src/apps/skills-manager/src/skills-manager/components/skill-modals/skill-form/SkillForm.tsx b/src/apps/admin/src/platform/skill-management/lib/components/skill-modals/skill-form/SkillForm.tsx
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/skill-modals/skill-form/SkillForm.tsx
rename to src/apps/admin/src/platform/skill-management/lib/components/skill-modals/skill-form/SkillForm.tsx
diff --git a/src/apps/skills-manager/src/skills-manager/components/skill-modals/skill-form/index.ts b/src/apps/admin/src/platform/skill-management/lib/components/skill-modals/skill-form/index.ts
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/skill-modals/skill-form/index.ts
rename to src/apps/admin/src/platform/skill-management/lib/components/skill-modals/skill-form/index.ts
diff --git a/src/apps/skills-manager/src/skills-manager/components/skills-list/SkillsList.module.scss b/src/apps/admin/src/platform/skill-management/lib/components/skills-list/SkillsList.module.scss
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/skills-list/SkillsList.module.scss
rename to src/apps/admin/src/platform/skill-management/lib/components/skills-list/SkillsList.module.scss
diff --git a/src/apps/skills-manager/src/skills-manager/components/skills-list/SkillsList.tsx b/src/apps/admin/src/platform/skill-management/lib/components/skills-list/SkillsList.tsx
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/skills-list/SkillsList.tsx
rename to src/apps/admin/src/platform/skill-management/lib/components/skills-list/SkillsList.tsx
diff --git a/src/apps/skills-manager/src/skills-manager/components/skills-list/index.ts b/src/apps/admin/src/platform/skill-management/lib/components/skills-list/index.ts
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/components/skills-list/index.ts
rename to src/apps/admin/src/platform/skill-management/lib/components/skills-list/index.ts
diff --git a/src/apps/skills-manager/src/skills-manager/config/constants.ts b/src/apps/admin/src/platform/skill-management/lib/config/constants.ts
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/config/constants.ts
rename to src/apps/admin/src/platform/skill-management/lib/config/constants.ts
diff --git a/src/apps/skills-manager/src/skills-manager/config/index.ts b/src/apps/admin/src/platform/skill-management/lib/config/index.ts
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/config/index.ts
rename to src/apps/admin/src/platform/skill-management/lib/config/index.ts
diff --git a/src/apps/skills-manager/src/skills-manager/context/index.ts b/src/apps/admin/src/platform/skill-management/lib/context/index.ts
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/context/index.ts
rename to src/apps/admin/src/platform/skill-management/lib/context/index.ts
diff --git a/src/apps/skills-manager/src/skills-manager/context/skills-manager.context.tsx b/src/apps/admin/src/platform/skill-management/lib/context/skills-manager.context.tsx
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/context/skills-manager.context.tsx
rename to src/apps/admin/src/platform/skill-management/lib/context/skills-manager.context.tsx
diff --git a/src/apps/skills-manager/src/skills-manager/context/use-skills-bulk-editor-context.tsx b/src/apps/admin/src/platform/skill-management/lib/context/use-skills-bulk-editor-context.tsx
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/context/use-skills-bulk-editor-context.tsx
rename to src/apps/admin/src/platform/skill-management/lib/context/use-skills-bulk-editor-context.tsx
diff --git a/src/apps/skills-manager/src/skills-manager/lib/index.ts b/src/apps/admin/src/platform/skill-management/lib/lib/index.ts
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/lib/index.ts
rename to src/apps/admin/src/platform/skill-management/lib/lib/index.ts
diff --git a/src/apps/skills-manager/src/skills-manager/lib/skills.utils.ts b/src/apps/admin/src/platform/skill-management/lib/lib/skills.utils.ts
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/lib/skills.utils.ts
rename to src/apps/admin/src/platform/skill-management/lib/lib/skills.utils.ts
diff --git a/src/apps/skills-manager/src/skills-manager/services/index.ts b/src/apps/admin/src/platform/skill-management/lib/services/index.ts
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/services/index.ts
rename to src/apps/admin/src/platform/skill-management/lib/services/index.ts
diff --git a/src/apps/skills-manager/src/skills-manager/services/skills-categories.service.ts b/src/apps/admin/src/platform/skill-management/lib/services/skills-categories.service.ts
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/services/skills-categories.service.ts
rename to src/apps/admin/src/platform/skill-management/lib/services/skills-categories.service.ts
diff --git a/src/apps/skills-manager/src/skills-manager/services/skills.service.ts b/src/apps/admin/src/platform/skill-management/lib/services/skills.service.ts
similarity index 100%
rename from src/apps/skills-manager/src/skills-manager/services/skills.service.ts
rename to src/apps/admin/src/platform/skill-management/lib/services/skills.service.ts
diff --git a/src/apps/gamification-admin/src/GamificationAdmin.tsx b/src/apps/gamification-admin/src/GamificationAdmin.tsx
deleted file mode 100644
index 956e8d21a..000000000
--- a/src/apps/gamification-admin/src/GamificationAdmin.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import { FC, useContext } from 'react'
-import { Outlet, Routes } from 'react-router-dom'
-import { SWRConfig } from 'swr'
-
-import { ToolTitle } from '~/config'
-import { routerContext, RouterContextData, xhrGetAsync } from '~/libs/core'
-
-export const toolTitle: string = ToolTitle.gamificationAdmin
-
-const GamificationAdmin: FC<{}> = () => {
-
-    const { getChildRoutes }: RouterContextData = useContext(routerContext)
-
-    return (
-        <SWRConfig
-            value={{
-                fetcher: resource => xhrGetAsync(resource),
-                refreshInterval: 60000, // 1 min
-            }}
-        >
-            <Outlet />
-            <Routes>
-                {getChildRoutes(toolTitle)}
-            </Routes>
-        </SWRConfig>
-    )
-}
-
-export default GamificationAdmin
diff --git a/src/apps/gamification-admin/src/game-lib/hooks/use-gamification-breadcrumb.hook.tsx b/src/apps/gamification-admin/src/game-lib/hooks/use-gamification-breadcrumb.hook.tsx
deleted file mode 100644
index 4bcbae662..000000000
--- a/src/apps/gamification-admin/src/game-lib/hooks/use-gamification-breadcrumb.hook.tsx
+++ /dev/null
@@ -1,17 +0,0 @@
-import { BreadcrumbItemModel } from '~/libs/ui'
-
-import { toolTitle } from '../../GamificationAdmin'
-import { rootRoute } from '../../gamification-admin.routes'
-
-export function useGamificationBreadcrumb(items: Array<BreadcrumbItemModel>): Array<BreadcrumbItemModel> {
-
-    const breadcrumb: Array<BreadcrumbItemModel> = [
-        {
-            name: toolTitle,
-            url: rootRoute || '/',
-        },
-        ...items,
-    ]
-
-    return breadcrumb
-}
diff --git a/src/apps/gamification-admin/src/game-lib/index.ts b/src/apps/gamification-admin/src/game-lib/index.ts
index f7cba96f4..dc15c5b7b 100644
--- a/src/apps/gamification-admin/src/game-lib/index.ts
+++ b/src/apps/gamification-admin/src/game-lib/index.ts
@@ -1,6 +1,5 @@
 export * from './game-badge.model'
 export * from './hooks/use-get-game-badges-page.hook'
-export * from './hooks/use-gamification-breadcrumb.hook'
 export * from './hooks/use-get-game-badge-details.hook'
 export * from './member-autocomplete'
 export * from './pagination'
diff --git a/src/apps/gamification-admin/src/game-lib/modals/badge-created-modal/BadgeCreatedModal.tsx b/src/apps/gamification-admin/src/game-lib/modals/badge-created-modal/BadgeCreatedModal.tsx
index bbfd48005..95ff0e600 100644
--- a/src/apps/gamification-admin/src/game-lib/modals/badge-created-modal/BadgeCreatedModal.tsx
+++ b/src/apps/gamification-admin/src/game-lib/modals/badge-created-modal/BadgeCreatedModal.tsx
@@ -12,6 +12,7 @@ export interface BadgeCreatedModalProps {
     badge: GameBadge
     isOpen: boolean
     onClose: () => void
+    rootPage: string;
 }
 
 const BadgeCreatedModal: FC<BadgeCreatedModalProps> = (props: BadgeCreatedModalProps) => {
@@ -52,7 +53,7 @@ const BadgeCreatedModal: FC<BadgeCreatedModalProps> = (props: BadgeCreatedModalP
                             label='View'
                             primary
                             size='lg'
-                            to={badgeDetailPath(props.badge.id)}
+                            to={badgeDetailPath(props.rootPage, props.badge.id)}
                         />
                         <Button
                             label='Create a new badge'
diff --git a/src/apps/gamification-admin/src/gamification-admin.routes.tsx b/src/apps/gamification-admin/src/gamification-admin.routes.tsx
index f59d4bbdd..ba4c20492 100644
--- a/src/apps/gamification-admin/src/gamification-admin.routes.tsx
+++ b/src/apps/gamification-admin/src/gamification-admin.routes.tsx
@@ -1,48 +1,14 @@
-import { AppSubdomain, EnvironmentConfig } from '~/config'
-import { lazyLoad, LazyLoadedComponent, PlatformRoute, UserRole } from '~/libs/core'
-
-import { toolTitle } from './GamificationAdmin'
-
-const GamificationAdmin: LazyLoadedComponent = lazyLoad(() => import('./GamificationAdmin'))
-const BadgeDetailPage: LazyLoadedComponent = lazyLoad(() => import('./pages/badge-detail/BadgeDetailPage'))
-const BadgeListingPage: LazyLoadedComponent = lazyLoad(() => import('./pages/badge-listing/BadgeListingPage'))
-const CreateBadgePage: LazyLoadedComponent = lazyLoad(() => import('./pages/create-badge/CreateBadgePage'))
-
-export const rootRoute: string = (
-    EnvironmentConfig.SUBDOMAIN === AppSubdomain.gamificationAdmin ? '' : `/${AppSubdomain.gamificationAdmin}`
-)
 export const baseDetailPath: string = '/badge-detail'
 export const createBadgePath: string = '/create-badge'
 
-export function badgeDetailPath(badgeId: string, view?: 'edit' | 'award'): string {
-    return `${rootRoute}${baseDetailPath}/${badgeId}${!!view ? `#${view}` : ''}`
+export function badgeDetailPath(
+    rootPage: string,
+    badgeId: string,
+    view?: 'edit' | 'award',
+): string {
+    return `${rootPage}${baseDetailPath}/${badgeId}${!!view ? `#${view}` : ''}`
 }
 
-export const createBadgeRoute: string = `${rootRoute}${createBadgePath}`
-
-export const gamificationAdminRoutes: ReadonlyArray<PlatformRoute> = [
-    {
-        authRequired: true,
-        children: [
-            {
-                element: <BadgeListingPage />,
-                route: '/',
-            },
-            {
-                element: <CreateBadgePage />,
-                route: createBadgePath,
-            },
-            {
-                element: <BadgeDetailPage />,
-                route: `${baseDetailPath}/:id`,
-            },
-        ],
-        domain: AppSubdomain.gamificationAdmin,
-        element: <GamificationAdmin />,
-        id: toolTitle,
-        rolesRequired: [
-            UserRole.gamificationAdmin,
-        ],
-        route: rootRoute,
-    },
-]
+export const createBadgeRoute: (rootPage: string) => string = (
+    rootPage: string,
+) => `${rootPage}${createBadgePath}`
diff --git a/src/apps/gamification-admin/src/pages/badge-detail/BadgeDetailPage.tsx b/src/apps/gamification-admin/src/pages/badge-detail/BadgeDetailPage.tsx
index 6a1b40d90..49bd6560f 100644
--- a/src/apps/gamification-admin/src/pages/badge-detail/BadgeDetailPage.tsx
+++ b/src/apps/gamification-admin/src/pages/badge-detail/BadgeDetailPage.tsx
@@ -9,9 +9,10 @@ import {
     RefObject,
     SetStateAction,
     useEffect,
+    useMemo,
     useState,
 } from 'react'
-import { Params, useLocation, useParams } from 'react-router-dom'
+import { Params, useLocation, useNavigate, useParams } from 'react-router-dom'
 import { toast } from 'react-toastify'
 import { KeyedMutator, useSWRConfig } from 'swr'
 import { FullConfiguration } from 'swr/dist/types'
@@ -20,8 +21,6 @@ import MarkdownIt from 'markdown-it'
 import sanitizeHtml from 'sanitize-html'
 
 import {
-    Breadcrumb,
-    BreadcrumbItemModel,
     Button,
     ButtonProps,
     ContentLayout,
@@ -39,7 +38,6 @@ import {
     BadgeDetailPageHandler,
     GameBadge,
     Sort,
-    useGamificationBreadcrumb,
     useGetGameBadgeDetails,
     useGetGameBadgesPage,
 } from '../../game-lib'
@@ -60,20 +58,18 @@ const md: MarkdownIt = new MarkdownIt({
     // typographer: true,
 })
 
-const BadgeDetailPage: FC = () => {
+interface Props extends GameBadge {
+    rootPage: string;
+}
+const BadgeDetailPage: FC<Props> = (props: Props) => {
+    const initColumns = useMemo(() => badgeListingColumns(props.rootPage), [props.rootPage])
+    const navigate = useNavigate()
     const [headerButtonConfig, setHeaderButtonConfig]: [
         ButtonProps | undefined,
         Dispatch<SetStateAction<ButtonProps | undefined>>,
     ]
         = useState<ButtonProps | undefined>()
 
-    const breadcrumb: Array<BreadcrumbItemModel> = useGamificationBreadcrumb([
-        {
-            name: 'badge detail',
-            url: '#',
-        },
-    ])
-
     const { id: badgeID }: Readonly<Params<string>> = useParams()
 
     const { hash }: { hash: string } = useLocation()
@@ -106,7 +102,7 @@ const BadgeDetailPage: FC = () => {
         = useState<boolean>(false)
 
     // badgeListingMutate will reset badge listing page cache when called
-    const sort: Sort = tableGetDefaultSort(badgeListingColumns)
+    const sort: Sort = tableGetDefaultSort(initColumns)
     const { mutate: badgeListingMutate }: { mutate: KeyedMutator<any> } = useGetGameBadgesPage(sort)
 
     const [badgeNameErrorText, setBadgeNameErrorText]: [
@@ -153,6 +149,7 @@ const BadgeDetailPage: FC = () => {
                     onBadgeUpdated()
                 })
         }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [
         newImageFile,
     ])
@@ -175,6 +172,7 @@ const BadgeDetailPage: FC = () => {
                 default: break
             }
         }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [
         badgeDetailsHandler.data,
     ])
@@ -201,6 +199,7 @@ const BadgeDetailPage: FC = () => {
                 setShowActivatedModal(true)
                 onBadgeUpdated()
             })
+            // eslint-disable-next-line no-alert
             .catch(e => alert(`onActivateBadge error: ${e.message}`))
     }
 
@@ -217,6 +216,7 @@ const BadgeDetailPage: FC = () => {
                 setShowActivatedModal(true)
                 onBadgeUpdated()
             })
+            // eslint-disable-next-line no-alert
             .catch(e => alert(`onDisableBadge error: ${e.message}`))
     }
 
@@ -371,8 +371,13 @@ const BadgeDetailPage: FC = () => {
         <ContentLayout
             title='Badge Detail'
             buttonConfig={headerButtonConfig}
+            secondaryButtonConfig={{
+                label: 'Back',
+                onClick: () => {
+                    navigate('./../../')
+                },
+            }}
         >
-            <Breadcrumb items={breadcrumb} />
             <div className={styles.container}>
                 {
                     badgeDetailsHandler.error ? (
diff --git a/src/apps/gamification-admin/src/pages/badge-listing/BadgeListingPage.tsx b/src/apps/gamification-admin/src/pages/badge-listing/BadgeListingPage.tsx
index 9d293d873..315f5c306 100644
--- a/src/apps/gamification-admin/src/pages/badge-listing/BadgeListingPage.tsx
+++ b/src/apps/gamification-admin/src/pages/badge-listing/BadgeListingPage.tsx
@@ -1,4 +1,4 @@
-import { Dispatch, FC, SetStateAction, useState } from 'react'
+import { Dispatch, FC, SetStateAction, useMemo, useState } from 'react'
 import { NavigateFunction, useNavigate } from 'react-router-dom'
 
 import {
@@ -16,15 +16,19 @@ import { createBadgeRoute } from '../../gamification-admin.routes'
 import { badgeListingColumns } from './badge-listing-table'
 import styles from './BadgeListingPage.module.scss'
 
-const BadgeListingPage: FC = () => {
+interface Props extends GameBadge {
+    rootPage: string;
+}
+const BadgeListingPage: FC<Props> = (props: Props) => {
+    const initColumns = useMemo(() => badgeListingColumns(props.rootPage), [props.rootPage])
 
     const [sort, setSort]: [Sort, Dispatch<SetStateAction<Sort>>]
-        = useState<Sort>(tableGetDefaultSort(badgeListingColumns))
+        = useState<Sort>(tableGetDefaultSort(initColumns))
     const [columns]: [
         ReadonlyArray<TableColumn<GameBadge>>,
         Dispatch<SetStateAction<ReadonlyArray<TableColumn<GameBadge>>>>,
     ]
-        = useState<ReadonlyArray<TableColumn<GameBadge>>>([...badgeListingColumns])
+        = useState<ReadonlyArray<TableColumn<GameBadge>>>(initColumns)
 
     const pageHandler: InfinitePageHandler<GameBadge> = useGetGameBadgesPage(sort)
     const navigate: NavigateFunction = useNavigate()
@@ -36,7 +40,7 @@ const BadgeListingPage: FC = () => {
     // header button config
     const buttonConfig: ButtonProps = {
         label: 'Create New Badge',
-        onClick: () => navigate(createBadgeRoute),
+        onClick: () => navigate(createBadgeRoute(props.rootPage)),
     }
 
     if (!pageHandler.data) {
diff --git a/src/apps/gamification-admin/src/pages/badge-listing/badge-listing-table/badge-action-renderer/BadgeActionRenderer.tsx b/src/apps/gamification-admin/src/pages/badge-listing/badge-listing-table/badge-action-renderer/BadgeActionRenderer.tsx
index e0ecec65a..47e3abbb0 100644
--- a/src/apps/gamification-admin/src/pages/badge-listing/badge-listing-table/badge-action-renderer/BadgeActionRenderer.tsx
+++ b/src/apps/gamification-admin/src/pages/badge-listing/badge-listing-table/badge-action-renderer/BadgeActionRenderer.tsx
@@ -6,8 +6,12 @@ import { badgeDetailPath } from '../../../../gamification-admin.routes'
 
 import styles from './BadgeActionRenderer.module.scss'
 
-const BadgeActionRenderer: (badge: GameBadge) => JSX.Element
-    = (badge: GameBadge): JSX.Element => {
+interface Props extends GameBadge {
+    rootPage: string;
+}
+
+const BadgeActionRenderer: (props: Props) => JSX.Element
+    = (props: Props): JSX.Element => {
 
         const isMobile: boolean = useCheckIsMobile()
 
@@ -33,7 +37,7 @@ const BadgeActionRenderer: (badge: GameBadge) => JSX.Element
                         size={isMobile ? 'sm' : 'md'}
                         key={button.label}
                         label={button.label}
-                        to={badgeDetailPath(badge.id, button.view)}
+                        to={badgeDetailPath(props.rootPage, props.id, button.view)}
                     />
                 ))}
             </div>
diff --git a/src/apps/gamification-admin/src/pages/badge-listing/badge-listing-table/badge-listing-table.config.tsx b/src/apps/gamification-admin/src/pages/badge-listing/badge-listing-table/badge-listing-table.config.tsx
index 98816486a..28923a638 100644
--- a/src/apps/gamification-admin/src/pages/badge-listing/badge-listing-table/badge-listing-table.config.tsx
+++ b/src/apps/gamification-admin/src/pages/badge-listing/badge-listing-table/badge-listing-table.config.tsx
@@ -5,17 +5,17 @@ import { GameBadge } from '../../../game-lib'
 import { BadgeActionRenderer } from './badge-action-renderer'
 import { BadgeListingNameRenderer } from './badge-name-renderer'
 
-export const badgeListingColumns: ReadonlyArray<TableColumn<GameBadge>> = [
+export const badgeListingColumns: (rootPage: string) => ReadonlyArray<TableColumn<GameBadge>> = (rootPage: string) => [
     {
         defaultSortDirection: 'asc',
         isDefaultSort: true,
         label: 'Badge Name',
         propertyName: 'badge_name',
-        renderer: BadgeListingNameRenderer,
+        renderer: (data: GameBadge) => <BadgeListingNameRenderer {...data} />,
         type: 'element',
     },
     {
-        renderer: BadgeActionRenderer,
+        renderer: (data: GameBadge) => <BadgeActionRenderer {...data} rootPage={rootPage} />,
         type: 'action',
     },
 ]
diff --git a/src/apps/gamification-admin/src/pages/create-badge/CreateBadgePage.tsx b/src/apps/gamification-admin/src/pages/create-badge/CreateBadgePage.tsx
index 094f8fa1c..e1b4529f4 100644
--- a/src/apps/gamification-admin/src/pages/create-badge/CreateBadgePage.tsx
+++ b/src/apps/gamification-admin/src/pages/create-badge/CreateBadgePage.tsx
@@ -1,21 +1,18 @@
-import { Dispatch, FC, SetStateAction, useState } from 'react'
+import { Dispatch, FC, SetStateAction, useMemo, useState } from 'react'
 
-import { Breadcrumb, BreadcrumbItemModel, ContentLayout } from '~/libs/ui'
+import { ContentLayout } from '~/libs/ui'
 
-import { GameBadge, useGamificationBreadcrumb } from '../../game-lib'
+import { GameBadge } from '../../game-lib'
 import { BadgeCreatedModal } from '../../game-lib/modals/badge-created-modal'
 
 import { CreateBadgeForm, createBadgeFormDef } from './create-badge-form'
 import styles from './CreateBadgePage.module.scss'
 
-const CreateBadgePage: FC = () => {
-
-    const breadcrumb: Array<BreadcrumbItemModel> = useGamificationBreadcrumb([
-        {
-            name: 'create badge',
-            url: '#',
-        },
-    ])
+interface Props extends GameBadge {
+    rootPage: string;
+}
+const CreateBadgePage: FC<Props> = (props: Props) => {
+    const formDef = useMemo(() => createBadgeFormDef(props.rootPage), [props.rootPage])
 
     const [showBadgeCreatedModal, setShowBadgeCreatedModal]: [boolean, Dispatch<SetStateAction<boolean>>]
         = useState<boolean>(false)
@@ -37,16 +34,16 @@ const CreateBadgePage: FC = () => {
         <ContentLayout
             title='Create Badge'
         >
-            <Breadcrumb items={breadcrumb} />
             <div className={styles.container}>
                 <CreateBadgeForm
-                    formDef={createBadgeFormDef}
+                    formDef={formDef}
                     onSave={onSave}
                 />
             </div>
             {
                 createdBadge && (
                     <BadgeCreatedModal
+                        rootPage={props.rootPage}
                         badge={createdBadge}
                         isOpen={showBadgeCreatedModal}
                         onClose={handleCloseCreateModal}
diff --git a/src/apps/gamification-admin/src/pages/create-badge/create-badge-form/create-badge-form.config.tsx b/src/apps/gamification-admin/src/pages/create-badge/create-badge-form/create-badge-form.config.tsx
index 5f715c5a2..36845988d 100644
--- a/src/apps/gamification-admin/src/pages/create-badge/create-badge-form/create-badge-form.config.tsx
+++ b/src/apps/gamification-admin/src/pages/create-badge/create-badge-form/create-badge-form.config.tsx
@@ -3,7 +3,6 @@ import { noop } from 'lodash'
 import { FormDefinition, IconOutline, validatorRequired } from '~/libs/ui'
 
 import { ACCEPTED_BADGE_MIME_TYPES, MAX_BADGE_IMAGE_FILE_SIZE } from '../../../config'
-import { rootRoute } from '../../../gamification-admin.routes'
 
 export enum CreateBadgeFormField {
     badgeActive = 'badgeActive',
@@ -12,7 +11,7 @@ export enum CreateBadgeFormField {
     file = 'file',
 }
 
-export const createBadgeFormDef: FormDefinition = {
+export const createBadgeFormDef: (rootPage: string) => FormDefinition = (rootPage: string) => ({
     buttons: {
         primaryGroup: [
             {
@@ -28,7 +27,7 @@ export const createBadgeFormDef: FormDefinition = {
             {
                 buttonStyle: 'secondary',
                 icon: IconOutline.ChevronLeftIcon,
-                route: rootRoute || '/',
+                route: rootPage,
                 size: 'lg',
             },
         ],
@@ -90,4 +89,4 @@ export const createBadgeFormDef: FormDefinition = {
         },
         renderGroupDividers: false,
     },
-}
+} as FormDefinition)
diff --git a/src/apps/platform/src/platform.routes.tsx b/src/apps/platform/src/platform.routes.tsx
index 3f85dbbc5..cfe671bc5 100644
--- a/src/apps/platform/src/platform.routes.tsx
+++ b/src/apps/platform/src/platform.routes.tsx
@@ -2,12 +2,10 @@
 import { lazyLoad, LazyLoadedComponent, PlatformRoute } from '~/libs/core'
 import { learnRoutes } from '~/apps/learn'
 import { devCenterRoutes } from '~/apps/dev-center'
-import { gamificationAdminRoutes } from '~/apps/gamification-admin'
 import { profilesRoutes } from '~/apps/profiles'
 import { talentSearchRoutes } from '~/apps/talent-search'
 import { accountsRoutes } from '~/apps/accounts'
 import { onboardingRoutes } from '~/apps/onboarding'
-import { skillsManagerRoutes } from '~/apps/skills-manager'
 import { walletRoutes } from '~/apps/wallet'
 import { walletAdminRoutes } from '~/apps/wallet-admin'
 import { copilotsRoutes } from '~/apps/copilots'
@@ -34,13 +32,11 @@ export const platformRoutes: Array<PlatformRoute> = [
     ...devCenterRoutes,
     ...copilotsRoutes,
     ...learnRoutes,
-    ...gamificationAdminRoutes,
     ...talentSearchRoutes,
     ...profilesRoutes,
     ...walletRoutes,
     ...walletAdminRoutes,
     ...accountsRoutes,
-    ...skillsManagerRoutes,
     ...homeRoutes,
     ...adminRoutes,
 ]
diff --git a/src/apps/skills-manager/README.md b/src/apps/skills-manager/README.md
deleted file mode 100644
index 02ce1d594..000000000
--- a/src/apps/skills-manager/README.md
+++ /dev/null
@@ -1 +0,0 @@
-# Admin App
diff --git a/src/apps/skills-manager/index.tsx b/src/apps/skills-manager/index.tsx
deleted file mode 100644
index 6f39cd49b..000000000
--- a/src/apps/skills-manager/index.tsx
+++ /dev/null
@@ -1 +0,0 @@
-export * from './src'
diff --git a/src/apps/skills-manager/src/SkillsManagerApp.tsx b/src/apps/skills-manager/src/SkillsManagerApp.tsx
deleted file mode 100644
index 42c521c7e..000000000
--- a/src/apps/skills-manager/src/SkillsManagerApp.tsx
+++ /dev/null
@@ -1,22 +0,0 @@
-import { FC, useContext } from 'react'
-import { Outlet, Routes } from 'react-router-dom'
-
-import { routerContext, RouterContextData } from '~/libs/core'
-import { SharedSwrConfig } from '~/libs/shared'
-
-import { toolTitle } from './skills-manager.routes'
-
-const SkillsManagerApp: FC<{}> = () => {
-    const { getChildRoutes }: RouterContextData = useContext(routerContext)
-
-    return (
-        <SharedSwrConfig>
-            <Outlet />
-            <Routes>
-                {getChildRoutes(toolTitle)}
-            </Routes>
-        </SharedSwrConfig>
-    )
-}
-
-export default SkillsManagerApp
diff --git a/src/apps/skills-manager/src/index.ts b/src/apps/skills-manager/src/index.ts
deleted file mode 100644
index 6b1936c79..000000000
--- a/src/apps/skills-manager/src/index.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-export {
-    skillsManagerRoutes,
-    rootRoute as skillsManagerRootRoute,
-} from './skills-manager.routes'
diff --git a/src/apps/skills-manager/src/skills-manager.routes.tsx b/src/apps/skills-manager/src/skills-manager.routes.tsx
deleted file mode 100644
index 2ed9fc105..000000000
--- a/src/apps/skills-manager/src/skills-manager.routes.tsx
+++ /dev/null
@@ -1,34 +0,0 @@
-import { Navigate } from 'react-router-dom'
-
-import { lazyLoad, LazyLoadedComponent, PlatformRoute, UserRole } from '~/libs/core'
-import { AppSubdomain, EnvironmentConfig, ToolTitle } from '~/config'
-
-import { skillsManagerRootRoute, skillsManagerRoutes as skillsManagerChildRoutes } from './skills-manager'
-
-const SkillsManagerApp: LazyLoadedComponent = lazyLoad(() => import('./SkillsManagerApp'))
-
-export const rootRoute: string = (
-    EnvironmentConfig.SUBDOMAIN === AppSubdomain.skillsManager ? '' : `/${AppSubdomain.skillsManager}`
-)
-
-export const toolTitle: string = ToolTitle.skillsManager
-export const absoluteRootRoute: string = `${window.location.origin}${rootRoute}`
-
-export const skillsManagerRoutes: ReadonlyArray<PlatformRoute> = [
-    {
-        authRequired: true,
-        children: [
-            ...skillsManagerChildRoutes,
-            {
-                element: <Navigate to={`${rootRoute}${skillsManagerRootRoute}`} />,
-                id: 'Default SkillsManager Route',
-                route: '',
-            },
-        ],
-        domain: AppSubdomain.skillsManager,
-        element: <SkillsManagerApp />,
-        id: toolTitle,
-        rolesRequired: [UserRole.administrator],
-        route: rootRoute,
-    },
-]
diff --git a/src/apps/skills-manager/src/skills-manager/SkillsManager.tsx b/src/apps/skills-manager/src/skills-manager/SkillsManager.tsx
deleted file mode 100644
index b194d0edc..000000000
--- a/src/apps/skills-manager/src/skills-manager/SkillsManager.tsx
+++ /dev/null
@@ -1,22 +0,0 @@
-import { FC, useContext } from 'react'
-import { Outlet, Routes } from 'react-router-dom'
-
-import { routerContext, RouterContextData } from '~/libs/core'
-
-import { skillsManagerRoutes } from './skills-manager.routes'
-import { SkillsManagerContext } from './context'
-
-const SkillsManager: FC<{}> = () => {
-    const { getRouteElement }: RouterContextData = useContext(routerContext)
-
-    return (
-        <SkillsManagerContext>
-            <Outlet />
-            <Routes>
-                {skillsManagerRoutes.map(getRouteElement)}
-            </Routes>
-        </SkillsManagerContext>
-    )
-}
-
-export default SkillsManager
diff --git a/src/apps/skills-manager/src/skills-manager/index.ts b/src/apps/skills-manager/src/skills-manager/index.ts
deleted file mode 100644
index 563f214af..000000000
--- a/src/apps/skills-manager/src/skills-manager/index.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-export {
-    skillsManagerMainRoute as skillsManagerRoutes,
-    rootRoute as skillsManagerRootRoute,
-} from './skills-manager.routes'
diff --git a/src/apps/skills-manager/src/skills-manager/skills-manager.routes.tsx b/src/apps/skills-manager/src/skills-manager/skills-manager.routes.tsx
deleted file mode 100644
index 04eea1c7f..000000000
--- a/src/apps/skills-manager/src/skills-manager/skills-manager.routes.tsx
+++ /dev/null
@@ -1,24 +0,0 @@
-import { lazyLoad, LazyLoadedComponent, PlatformRoute } from '~/libs/core'
-
-export const rootRoute: string = '/skills'
-
-const SkillsManager: LazyLoadedComponent = lazyLoad(() => import('./SkillsManager'))
-const LandingPage: LazyLoadedComponent = lazyLoad(() => import('./landing-page'), 'LandingPage')
-
-export const skillsManagerRoutes: ReadonlyArray<PlatformRoute> = [
-    {
-        element: <LandingPage />,
-        route: '',
-    },
-]
-
-export const skillsManagerMainRoute: ReadonlyArray<PlatformRoute> = [
-    {
-        children: [
-            ...skillsManagerRoutes,
-        ],
-        element: <SkillsManager />,
-        id: 'Skills Manager',
-        route: rootRoute,
-    },
-]
diff --git a/src/config/constants.ts b/src/config/constants.ts
index f32dd4fdb..b862beb0b 100644
--- a/src/config/constants.ts
+++ b/src/config/constants.ts
@@ -1,9 +1,7 @@
 export enum AppSubdomain {
-    skillsManager = 'manage',
     accounts = 'account-settings',
     devCenter = 'devcenter',
     earn = 'earn',
-    gamificationAdmin = 'gamification-admin',
     profiles = 'profiles',
     tcAcademy = 'academy',
     onboarding = 'onboarding',
@@ -16,11 +14,9 @@ export enum AppSubdomain {
 }
 
 export enum ToolTitle {
-    skillsManager = 'Manage Skills',
     accounts = 'Account Settings',
     devCenter = 'Dev Center',
     earn = 'Opportunity Feed',
-    gamificationAdmin = 'Gamification Admin',
     profiles = 'Profiles',
     tcAcademy = 'Topcoder Academy',
     selfService = 'Self Service Challenges',
diff --git a/src/libs/ui/lib/components/tabs-navbar/TabsNavbar.tsx b/src/libs/ui/lib/components/tabs-navbar/TabsNavbar.tsx
index 22825f0e2..0b2d8f019 100644
--- a/src/libs/ui/lib/components/tabs-navbar/TabsNavbar.tsx
+++ b/src/libs/ui/lib/components/tabs-navbar/TabsNavbar.tsx
@@ -92,7 +92,9 @@ const TabsNavbar: FC<TabsNavbarProps> = (props: TabsNavbarProps) => {
             initialTab.current = ''
         } else if (props.defaultActive) {
             setTabOpened(props.defaultActive)
-            updateOffset(props.defaultActive)
+            setTimeout(() => {
+                updateOffset(props.defaultActive)
+            }, 100)
         }
     }, [
         props.defaultActive,