From 276e0a5b690c5e8918dafaa6f8bf8a2a53828c4c Mon Sep 17 00:00:00 2001 From: Quentin AUBERT Date: Wed, 4 Dec 2024 17:01:21 +0100 Subject: [PATCH] FIX #771 --- daikoku/app/utils/ApiService.scala | 2 +- .../backoffice/apikeys/TeamApiKeysForApi.tsx | 83 ++++++++++++++++++- .../src/components/frontend/api/ApiHome.tsx | 27 +++--- .../src/locales/en/translation.json | 3 +- .../src/locales/fr/translation.json | 3 +- 5 files changed, 100 insertions(+), 18 deletions(-) diff --git a/daikoku/app/utils/ApiService.scala b/daikoku/app/utils/ApiService.scala index c45387cfd..2e543b473 100644 --- a/daikoku/app/utils/ApiService.scala +++ b/daikoku/app/utils/ApiService.scala @@ -2461,7 +2461,7 @@ class ApiService( ) ).map(s => Ok( - Json.obj("creation" -> "done", "subscription" -> s.asSafeJson) + Json.obj("creation" -> "done", "subscription" -> s.asJson) ) ) case steps => diff --git a/daikoku/javascript/src/components/backoffice/apikeys/TeamApiKeysForApi.tsx b/daikoku/javascript/src/components/backoffice/apikeys/TeamApiKeysForApi.tsx index 427674521..ea5e47a17 100644 --- a/daikoku/javascript/src/components/backoffice/apikeys/TeamApiKeysForApi.tsx +++ b/daikoku/javascript/src/components/backoffice/apikeys/TeamApiKeysForApi.tsx @@ -590,7 +590,6 @@ export const ApiKeyCard = ({ planQuery.data.customName || planQuery.data.type - console.debug({ subscription }) return (
@@ -814,3 +813,85 @@ export const Help = ({ message }: HelpProps) => { ); }; + +type SimpleApiKeyCardProps = { + subscription: ISubscription, + plan: IUsagePlan, + api: IApi + apiTeam: ITeamSimple +} + +export const SimpleApiKeyCard = (props: SimpleApiKeyCardProps) => { + const { translate } = useContext(I18nContext); + + const _customName = props.subscription.customName || props.plan.customName + + return ( +
+
+
+
{_customName}
+
+ + + + + + + + + +
+
{ + translate("subscription.for")} + {props.api.name}/{props.plan.customName} + {translate({ + key: 'subscription.created.at', replacements: [moment(props.subscription.createdAt).format(translate('moment.date.format.without.hours'))] + })} + + {props.subscription.validUntil && translate({ + key: 'subscription.valid.until', replacements: [moment(props.subscription.validUntil).format(translate('moment.date.format.without.hours'))] + })}
+
+
+
+ ) +} diff --git a/daikoku/javascript/src/components/frontend/api/ApiHome.tsx b/daikoku/javascript/src/components/frontend/api/ApiHome.tsx index 13f356f2c..84950450e 100644 --- a/daikoku/javascript/src/components/frontend/api/ApiHome.tsx +++ b/daikoku/javascript/src/components/frontend/api/ApiHome.tsx @@ -19,6 +19,7 @@ import classNames from 'classnames'; import 'highlight.js/styles/monokai.css'; import { GlobalContext } from '../../../contexts/globalContext'; import { CmsViewer } from '../CmsViewer'; +import { ApiKeyCard, SimpleApiKeyCard } from '../../backoffice/apikeys/TeamApiKeysForApi'; (window as any).hljs = hljs; @@ -135,7 +136,8 @@ export const ApiHome = ({ const [showAccessModal, setAccessModalError] = useState(); const [showGuestModal, setGuestModal] = useState(false); - const { connectedUser, tenant, reloadContext } = useContext(GlobalContext) + const { connectedUser, tenant, reloadContext } = useContext(GlobalContext); + const { openCustomModal, openRightPanel } = useContext(ModalContext); const navigate = useNavigate(); const defaultParams = useParams(); @@ -144,8 +146,6 @@ export const ApiHome = ({ .map((match: any) => match.params) .getOrElse(defaultParams); - console.log(params) - const { translate, Translation } = useContext(I18nContext); const { openLoginOrRegisterModal } = useContext(ModalContext); const { client } = useContext(getApolloContext()); @@ -243,7 +243,6 @@ export const ApiHome = ({ ); }; - const askForApikeys = ({ team, plan, apiKey, motivation }: { team: string, plan: IUsagePlan, apiKey?: ISubscription, motivation?: object }) => { const planName = formatPlanType(plan, translate); @@ -258,16 +257,16 @@ export const ApiHome = ({ return toast.error(result.error); } else if (Services.isCheckoutUrl(result)) { window.location.href = result.checkoutUrl - } else if (result.creation === 'done') { - const teamName = myTeams.find((t) => t._id === result.subscription.team)!.name; - return toast.success(translate({ key: 'subscription.plan.accepted', replacements: [planName, teamName] }), { - actionButtonStyle: { - color: 'inherit', - backgroundColor: 'inherit' - }, - action: navigate(`/${result.subscription.team}/settings/apikeys/${api._humanReadableId}/${api.currentVersion}`)} />, - - }); + } else if (Services.isCreationDone(result)) { + openRightPanel({ + title: translate('api.pricing.created.subscription.panel.title'), + content: + }) } else if (result.creation === 'waiting') { const teamName = myTeams.find((t) => t._id === team)!.name; return toast.info(translate({ key: 'subscription.plan.waiting', replacements: [planName, teamName] })); diff --git a/daikoku/javascript/src/locales/en/translation.json b/daikoku/javascript/src/locales/en/translation.json index 47138243f..647a68856 100644 --- a/daikoku/javascript/src/locales/en/translation.json +++ b/daikoku/javascript/src/locales/en/translation.json @@ -1399,5 +1399,6 @@ "subscription.copy.apikey.help": "Copy credentials as clientId:clientSecret", "subscription.copy.token.label": "token", "subscription.copy.token.help": "Copy daikoku token, used for retrieve credentials by API", - "setting.panel.reset.confirm.message": "Are you sure you want to reset your organization's data?" + "setting.panel.reset.confirm.message": "Are you sure you want to reset your organization's data?", + "api.pricing.created.subscription.panel.title": "Your API Key is Ready" } \ No newline at end of file diff --git a/daikoku/javascript/src/locales/fr/translation.json b/daikoku/javascript/src/locales/fr/translation.json index 261ad4958..4b7130f24 100644 --- a/daikoku/javascript/src/locales/fr/translation.json +++ b/daikoku/javascript/src/locales/fr/translation.json @@ -1400,5 +1400,6 @@ "subscription.copy.apikey.help": "Copier les identifiants sous la forme clientId:clientSecret", "subscription.copy.token.label": "Jeton", "subscription.copy.token.help": "Copier le jeton Daikoku, utilisable pour récupérer les identifiants par API", - "setting.panel.reset.confirm.message": "Êtes-vous sûr de vouloir réinitialiser les données de votre organisation ?" + "setting.panel.reset.confirm.message": "Êtes-vous sûr de vouloir réinitialiser les données de votre organisation ?", + "api.pricing.created.subscription.panel.title": "Votre clé d'API est prête" } \ No newline at end of file