Repository: freeCodeCamp/freeCodeCamp
File: client/src/components/settings/exam-token.tsx (TypeScript)

Code before:
          )}
          {examTokenError && <p style={{ color: 'red' }}>{examTokenError}</p>}
          {copySuccess && <p style={{ color: 'green' }}>{copySuccess}</p>}
          {copyError && <p style={{ color: 'red' }}>{copyError}</p>}
        </Modal.Body>
        <Modal.Footer>
          <Button
            onClick={() => {
              navigator.clipboard.writeText(examToken ?? '').then(
                () => {
                  setCopySuccess(t('exam-token.copied'));
                  setCopyError('');
                },
                () => {
                  setCopyError(t('exam-token.copy-error'));
                  setCopySuccess('');
                }
              );
            }}
          >
            {t('buttons.copy')}
          </Button>
          <Spacer size='s' />
          <Button
            onClick={() => {
              setGeneratedExamToken(false);
              setCopySuccess(null);
              setCopyError(null);
            }}
          >
            {t('buttons.close')}
          </Button>
        </Modal.Footer>
      </Modal>
      <Panel variant='info' id='exam-environment-authorization-token'>
        <Panel.Heading>{t('exam-token.exam-token')}</Panel.Heading>
        <Panel.Body>
          <p>{t('exam-token.note')}</p>
          <strong>{t('exam-token.invalidation')}</strong>
          <Spacer size='s' />
          <Button
            block={true}
            disabled={recentlyGenerated}
            onClick={() => {
              setGeneratedExamToken(true);
              void getToken();
            }}
          >
            {t('exam-token.generate-exam-token')}
          </Button>
        </Panel.Body>

Review comment (suggestion):
```suggestion
              setExamToken(null);
```

Code after:
        </Modal.Body>
        <Modal.Footer>
          <Button
            onClick={() => {
              navigator.clipboard.writeText(examToken ?? '').then(
                () => {
                  setCopySuccess(t('exam-token.copied'));
                  setCopyError(null);
                },
                () => {
                  setCopyError(t('exam-token.copy-error'));
                  setCopySuccess(null);
                }
              );
            }}
          >
            {t('buttons.copy')}
          </Button>
          <Spacer size='s' />
          <Button
            onClick={() => {
              setExamToken(null);
              setCopySuccess(null);
              setCopyError(null);
            }}
          >
            {t('buttons.close')}
          </Button>
        </Modal.Footer>
      </Modal>
      <Panel variant='info' id='exam-environment-authorization-token'>
        <Panel.Heading>{t('exam-token.exam-token')}</Panel.Heading>
        <Panel.Body>
          <p>{t('exam-token.note')}</p>
          <strong>{t('exam-token.invalidation')}</strong>
          <Spacer size='s' />
          <Button
            block={true}
            disabled={recentlyGenerated}
            onClick={() => void getToken()}
          >
            {t('exam-token.generate-exam-token')}
          </Button>
        </Panel.Body>
      </Panel>
    </FullWidthRow>
  );
}

ExamToken.displayName = 'ExamToken';