Merge pull request #1093 from topcoder-platform/diazz-admin-f2f-30376988

Topcoder Admin App - Misc Update 0601

Author: jmgasper

src/apps/admin/src/billing-account/BillingAccountNewPage/BillingAccountNewPage.tsx

@@ -30,7 +30,7 @@ import { useManageAddBillingAccount, useManageAddBillingAccountProps } from '../
 import { BILLING_ACCOUNT_STATUS_EDIT_OPTIONS } from '../../config/index.config'
 import { PageContent, PageHeader } from '../../lib'
 import { FormEditBillingAccount, SelectOption } from '../../lib/models'
-import { formEditBillingAccountSchema } from '../../lib/utils'
+import { formAddBillingAccountSchema, formEditBillingAccountSchema } from '../../lib/utils'
 
 import styles from './BillingAccountNewPage.module.scss'
 
@@ -46,6 +46,7 @@ export const BillingAccountNewPage: FC<Props> = (props: Props) => {
     const { accountId = '' }: { accountId?: string } = useParams<{
         accountId: string
     }>()
+    const isEdit = useMemo(() => !!accountId, [accountId])
     const {
         isLoading,
         isAdding,
@@ -55,8 +56,8 @@ export const BillingAccountNewPage: FC<Props> = (props: Props) => {
         billingAccount,
     }: useManageAddBillingAccountProps = useManageAddBillingAccount(accountId)
     const pageTitle = useMemo(
-        () => (accountId ? 'Edit Billing Account' : 'New Billing Account'),
-        [accountId],
+        () => (isEdit ? 'Edit Billing Account' : 'New Billing Account'),
+        [isEdit],
     )
     const {
         register,
@@ -81,7 +82,9 @@ export const BillingAccountNewPage: FC<Props> = (props: Props) => {
             subscriptionNumber: '' as any,
         },
         mode: 'all',
-        resolver: yupResolver(formEditBillingAccountSchema),
+        resolver: yupResolver(
+            isEdit ? formEditBillingAccountSchema : formAddBillingAccountSchema,
+        ),
     })
 
     const endDate = watch('endDate')
@@ -354,7 +357,9 @@ export const BillingAccountNewPage: FC<Props> = (props: Props) => {
                                 onChange={_.noop}
                                 classNameWrapper={styles.field}
                                 inputControl={register('paymentTerms')}
-                                disabled={isAdding || isUpdating}
+                                disabled={
+                                    isEdit ? true : isAdding || isUpdating
+                                }
                                 error={_.get(errors, 'paymentTerms.message')}
                                 dirty
                             />

src/apps/admin/src/lib/components/ReviewerList/ReviewerList.tsx

@@ -1,7 +1,7 @@
 import { FC, useMemo } from 'react'
 import { format } from 'date-fns'
 
-import { CheckIcon, XIcon } from '@heroicons/react/solid'
+import { CheckIcon } from '@heroicons/react/solid'
 import { useWindowSize, WindowSize } from '~/libs/shared'
 import {
     Button,
@@ -27,7 +27,6 @@ export interface ReviewerListProps {
     approvingReviewerId: number
     onPageChange: (page: number) => void
     onApproveApplication: (reviewer: Reviewer) => void
-    onUnapproveApplication: (reviewer: Reviewer) => void
     onToggleSort: (sort: Sort) => void
 }
 
@@ -36,22 +35,15 @@ const ApproveButton: FC<{
     openReviews: number
     approvingReviewerId: number
     onApproveApplication: ReviewerListProps['onApproveApplication']
-    onUnapproveApplication: ReviewerListProps['onUnapproveApplication']
 }> = props => {
     const handleApprove = useEventCallback((): void => {
         props.onApproveApplication(props.reviewer)
     })
 
-    const handleRemove = useEventCallback((): void => {
-        props.onUnapproveApplication(props.reviewer)
-    })
-
     const isApproving = props.approvingReviewerId === props.reviewer.userId
     const isOtherApproving = props.approvingReviewerId > 0
     const hideApproveButton
         = props.openReviews < 1 || props.reviewer.applicationStatus !== 'Pending'
-    const showRemoveButton
-        = props.reviewer.applicationStatus === 'Approved'
 
     return (
         <>
@@ -61,19 +53,7 @@ const ApproveButton: FC<{
                     className={styles.approvingLoadingSpinner}
                 />
             ) : (
-                hideApproveButton ? (
-                    showRemoveButton && (
-                        <Button
-                            primary
-                            variant='danger'
-                            onClick={handleRemove}
-                        >
-                            <XIcon className='icon icon-fill' />
-                            {' '}
-                            Remove Reviewer
-                        </Button>
-                    )
-                ) : (
+                !hideApproveButton && (
                     <Button
                         primary
                         onClick={handleApprove}
@@ -125,15 +105,13 @@ const Actions: FC<{
     openReviews: number
     approvingReviewerId: number
     onApproveApplication: ReviewerListProps['onApproveApplication']
-    onUnapproveApplication: ReviewerListProps['onUnapproveApplication']
 }> = props => (
     <div className={styles.rowActions}>
         <ApproveButton
             reviewer={props.reviewer}
             openReviews={props.openReviews}
             approvingReviewerId={props.approvingReviewerId}
             onApproveApplication={props.onApproveApplication}
-            onUnapproveApplication={props.onUnapproveApplication}
         />
     </div>
 )
@@ -202,7 +180,6 @@ const ReviewerList: FC<ReviewerListProps> = props => {
                         openReviews={props.openReviews}
                         approvingReviewerId={props.approvingReviewerId}
                         onApproveApplication={props.onApproveApplication}
-                        onUnapproveApplication={props.onUnapproveApplication}
                     />
                 ),
                 type: 'action',

src/apps/admin/src/lib/components/RolesFilter/RolesFilter.tsx

@@ -56,11 +56,6 @@ export const RolesFilter: FC<Props> = props => {
 
     useEffect(() => {
         props.setFilters({
-            createdAtString: roleName,
-            createdByHandle: roleName,
-            id: roleName,
-            modifiedAtString: roleName,
-            modifiedByHandle: roleName,
             roleName,
         })
     }, [roleName]) // eslint-disable-line react-hooks/exhaustive-deps

src/apps/admin/src/lib/models/FormEditBillingAccount.model.ts

@@ -11,7 +11,7 @@ export interface FormEditBillingAccount {
     poNumber: string
     subscriptionNumber?: number
     description: string
-    paymentTerms: number
+    paymentTerms?: number
     salesTax?: number
     client: {
         id: number

src/apps/admin/src/lib/models/TableRolesFilter.type.ts

@@ -2,11 +2,11 @@
  * Model for table roles filter
  */
 export type TableRolesFilter = {
-    id: string
+    id?: string
     roleName: string
-    createdAtString: string
-    modifiedAtString: string
-    createdByHandle: string
-    modifiedByHandle: string
+    createdAtString?: string
+    modifiedAtString?: string
+    createdByHandle?: string
+    modifiedByHandle?: string
 
 }

src/apps/admin/src/lib/utils/validation.ts

@@ -134,7 +134,7 @@ export function isValidNumber(value: number | undefined): boolean {
 /**
  * validation schema for form new billing account
  */
-export const formEditBillingAccountSchema: Yup.ObjectSchema<FormEditBillingAccount>
+export const formAddBillingAccountSchema: Yup.ObjectSchema<FormEditBillingAccount>
     = Yup.object({
         budgetAmount: Yup.number()
             .transform(value => (Number.isNaN(value) ? undefined : value))
@@ -183,6 +183,59 @@ export const formEditBillingAccountSchema: Yup.ObjectSchema<FormEditBillingAccou
             .min(1, 'Subscription number must be greater than or equal 1.'),
     })
 
+/**
+ * validation schema for form new billing account
+ */
+export const formEditBillingAccountSchema: Yup.ObjectSchema<FormEditBillingAccount>
+    = Yup.object({
+        budgetAmount: Yup.number()
+            .transform(value => (Number.isNaN(value) ? undefined : value))
+            .optional()
+            .typeError('Invalid number.')
+            .min(1, 'Budget amount must be greater than or equal 1.'),
+        client: Yup.object()
+            .shape({
+                id: Yup.number()
+                    .typeError('Invalid number.')
+                    .required('Id is required.'),
+                name: Yup.string()
+                    .required('Name is required.'),
+            })
+            .default(undefined)
+            .required('Client is required.'),
+        companyId: Yup.number()
+            .typeError('Invalid number.')
+            .required('Customer number is required.')
+            .min(1, 'Customer number must be greater than or equal 1.'),
+        description: Yup.string()
+            .trim()
+            .required('Description is required.'),
+        endDate: Yup.date()
+            .required('End date is required.'),
+        name: Yup.string()
+            .trim()
+            .required('Name is required.'),
+        paymentTerms: Yup.number()
+            .transform(value => (Number.isNaN(value) ? undefined : value))
+            .optional()
+            .typeError('Invalid number.')
+            .min(1, 'Payment terms must be greater than or equal 1.'),
+        poNumber: Yup.string()
+            .trim()
+            .required('PO Number is required.'),
+        salesTax: Yup.number()
+            .required('Sales tax is required.'),
+        startDate: Yup.date()
+            .required('Start date is required.'),
+        status: Yup.string()
+            .required('Status is required.'),
+        subscriptionNumber: Yup.number()
+            .transform(value => (Number.isNaN(value) ? undefined : value))
+            .optional()
+            .typeError('Invalid number.')
+            .min(1, 'Subscription number must be greater than or equal 1.'),
+    })
+
 /**
  * validation schema for form new billing account
  */

src/apps/admin/src/review-management/ManageReviewerPage/ManageReviewerPage.module.scss

@@ -3,6 +3,7 @@
     gap: 30px;
     margin-left: auto;
     margin-top: 16px;
+    flex-wrap: wrap;
 }
 
 .loadingSpinnerContainer {

src/apps/admin/src/review-management/ManageReviewerPage/ManageReviewerPage.tsx

@@ -7,7 +7,7 @@ import {
     useRef,
     useState,
 } from 'react'
-import { NavigateFunction, useNavigate, useParams } from 'react-router-dom'
+import { useParams } from 'react-router-dom'
 import { sortBy } from 'lodash'
 
 import { XIcon } from '@heroicons/react/solid'
@@ -63,7 +63,6 @@ export const ManageReviewerPage: FC = () => {
         challengeId: string
     }>()
     const [challengeUuid, setChallengeUuid] = useState('')
-    const navigate: NavigateFunction = useNavigate()
     const [filterCriteria, setFilterCriteria]: [
         ReviewFilterCriteria,
         Dispatch<SetStateAction<ReviewFilterCriteria>>
@@ -137,12 +136,6 @@ export const ManageReviewerPage: FC = () => {
             })
     })
 
-    const unapprove = useEventCallback((): void => {
-        if (challengeUuid) {
-            navigate(`${rootRoute}/challenge-management/${challengeUuid}/manage-user`)
-        }
-    })
-
     // Init
     useEffect(() => {
         search()
@@ -204,6 +197,14 @@ export const ManageReviewerPage: FC = () => {
             <PageHeader>
                 <h2>{`${pageTitle} ${challengeId}`}</h2>
                 <div className={styles.headerActions}>
+                    <LinkButton
+                        primary
+                        onClick={handleRejectPendingConfirmDialog}
+                        size='lg'
+                        to={`${rootRoute}/challenge-management/${challengeUuid}/manage-user`}
+                    >
+                        User Management
+                    </LinkButton>
                     <Button
                         primary
                         variant='danger'
@@ -232,7 +233,6 @@ export const ManageReviewerPage: FC = () => {
                         reviewers={reviewers}
                         openReviews={openReviews}
                         onApproveApplication={approve}
-                        onUnapproveApplication={unapprove}
                         approvingReviewerId={userId}
                         paging={{
                             page: filterCriteria.page,