Skip to content

Commit

Permalink
Merge pull request #1143 from bipuladh/update-modal
Browse files Browse the repository at this point in the history
Updates Onboarding modal to connect with provider proxy
  • Loading branch information
openshift-merge-bot[bot] authored Dec 28, 2023
2 parents 790a41d + 4eff2ba commit facdd8d
Show file tree
Hide file tree
Showing 2 changed files with 32 additions and 7 deletions.
2 changes: 1 addition & 1 deletion locales/en/plugin__odf-console.json
Original file line number Diff line number Diff line change
Expand Up @@ -965,6 +965,7 @@
"Generate client onboarding token": "Generate client onboarding token",
"Data Foundation version sync": "Data Foundation version sync",
"Client onboarding token": "Client onboarding token",
"Copy to clipboard": "Copy to clipboard",
"Raw Capacity": "Raw Capacity",
"Add Capacity": "Add Capacity",
"Cluster details": "Cluster details",
Expand Down Expand Up @@ -1212,7 +1213,6 @@
"Message": "Message",
"No conditions found": "No conditions found",
"Copied": "Copied",
"Copy to clipboard": "Copy to clipboard",
"View documentation": "View documentation",
"Oh no! Something went wrong.": "Oh no! Something went wrong.",
"Copied to clipboard": "Copied to clipboard",
Expand Down
37 changes: 31 additions & 6 deletions packages/odf/components/storage-consumers/onboarding-modal.tsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,8 @@
import * as React from 'react';
import { LoadingBox } from '@odf/shared';
import { ModalBody, ModalTitle } from '@odf/shared/generic/ModalTitle';
import { useCustomTranslation } from '@odf/shared/useCustomTranslationHook';
import { consoleFetch } from '@openshift-console/dynamic-plugin-sdk';
import { ModalComponent } from '@openshift-console/dynamic-plugin-sdk/lib/app/modal-support/ModalProvider';
import {
Modal,
Expand All @@ -23,22 +25,45 @@ export const ClientOnBoardingModal: ClientOnBoardingModalProps = ({
}) => {
const { t } = useCustomTranslation();
const MODAL_TITLE = t('Client onboarding token');

// eslint-disable-next-line @typescript-eslint/no-unused-vars
const [ticket, _setTicket] = React.useState('dummy--text');
// Todo(bipuladh): Add a HTTP request to proxy to get ticket
const [ticket, setTicket] = React.useState('');

const onCopyToClipboard = () => {
navigator.clipboard.writeText(ticket);
};

React.useEffect(() => {
consoleFetch(
'/api/proxy/plugin/odf-console/provider-proxy/onboarding-tokens',
{
method: 'post',
}
)
.then((response) => {
if (!response.ok) {
throw new Error('Network response is not ok!');
}
return response.text();
})
.then((text) => {
setTicket(text);
})
.catch((error) => {
// eslint-disable-next-line no-console
console.error('Provider proxy is not working as expected', error);
});
}, []);

return (
<Modal isOpen={isOpen} onClose={closeModal} variant={ModalVariant.small}>
<ModalTitle>{MODAL_TITLE}</ModalTitle>
<ModalBody>
<Flex direction={{ default: 'column' }}>
<FlexItem grow={{ default: 'grow' }}>
<div className="odf-onboarding-modal__text-area">{ticket}</div>
{ticket ? (
<div className="odf-onboarding-modal__text-area">{ticket}</div>
) : (
<LoadingBox />
)}
</FlexItem>
<FlexItem>
<Button
Expand All @@ -48,7 +73,7 @@ export const ClientOnBoardingModal: ClientOnBoardingModalProps = ({
className="pf-m-link--align-left odf-onboarding-modal__clipboard"
>
<ClipboardIcon />
Copy to Clipboard
{t('Copy to clipboard')}
</Button>
</FlexItem>
<FlexItem>
Expand Down

0 comments on commit facdd8d

Please sign in to comment.