From f1b75b36b6ad5d4cd3b7c0c9c766423889bb85f3 Mon Sep 17 00:00:00 2001 From: abhigyanghosh30 Date: Thu, 28 Sep 2023 18:11:37 +0530 Subject: [PATCH] exam data from prod listing --- .../js/src/advantage/credentials/api/keys.js | 12 ++++ .../components/CredExamShop/CredExamShop.tsx | 65 ++++++++++--------- .../components/CredKeyShop/CredKeyShop.tsx | 22 +++++-- .../subscribe/blender/utils/utils.ts | 1 + webapp/app.py | 4 ++ webapp/shop/cred/views.py | 19 ++++++ 6 files changed, 89 insertions(+), 34 deletions(-) diff --git a/static/js/src/advantage/credentials/api/keys.js b/static/js/src/advantage/credentials/api/keys.js index 98e7ca03e79..e070728d3db 100644 --- a/static/js/src/advantage/credentials/api/keys.js +++ b/static/js/src/advantage/credentials/api/keys.js @@ -52,3 +52,15 @@ export async function getKeyProducts() { const data = await response.json(); return data; } + +export async function getExamProducts() { + let response = await fetch("/credentials/exam/products", { + method: "GET", + headers: { + Accept: "application/json", + "Content-Type": "application/json", + }, + }); + const data = await response.json(); + return data; +} diff --git a/static/js/src/advantage/credentials/components/CredExamShop/CredExamShop.tsx b/static/js/src/advantage/credentials/components/CredExamShop/CredExamShop.tsx index ea66f421b93..7bb33dd29f8 100644 --- a/static/js/src/advantage/credentials/components/CredExamShop/CredExamShop.tsx +++ b/static/js/src/advantage/credentials/components/CredExamShop/CredExamShop.tsx @@ -1,29 +1,22 @@ -import React, { useState } from "react"; +import React, { useEffect, useState } from "react"; import { Button, Col, RadioInput, Row, Strip, + Spinner, } from "@canonical/react-components"; import classNames from "classnames"; import { currencyFormatter } from "advantage/react/utils"; +import { Product } from "advantage/subscribe/blender/utils/utils"; +import { useQuery } from "react-query"; +import { getExamProducts } from "advantage/credentials/api/keys"; const CredExamShop = () => { - const ExamProducts = [ + const ExamProductDescriptions = [ { id: "cue-linux-essentials", - longId: "lAK5jL8zvMjZOwaysIMQyGRAdOLgTQQH0xpezu2oYp74", - name: "CUE Linux Essentials", - period: "none", - price: { - currency: "USD", - value: 4900, - }, - productID: "cue-linux-essentials", - status: "active", - private: false, - marketplace: "canonical-cube", metadata: [ { key: "description", @@ -34,13 +27,6 @@ const CredExamShop = () => { }, { id: "cue-02-desktop", - longId: "lAMGrt4buzUR0-faJqg-Ot6dgNLn7ubIpWiyDgOrsDCg", - name: "CUE.02 Desktop QuickCert", - price: { value: 4900, currency: "USD" }, - productID: "cue-02-desktop", - canBeTrialled: false, - private: true, - marketplace: "canonical-cube", metadata: [ { key: "description", @@ -51,13 +37,6 @@ const CredExamShop = () => { }, { id: "cue-03-server", - longId: "lAMGrt4buzUR0-faJqg-Ot6dgNLn7ubIpWiyDgOrsDCg", - name: "CUE.03 Server QuickCert", - price: { value: 4900, currency: "USD" }, - productID: "cue-03-server", - canBeTrialled: false, - private: true, - marketplace: "canonical-cube", metadata: [ { key: "description", @@ -67,6 +46,10 @@ const CredExamShop = () => { ], }, ]; + const { isLoading, data: ExamData } = useQuery(["ExamProducts"], async () => { + return getExamProducts(); + }); + const [ExamProducts, setExamProducts] = useState([]); const [exam, setExam] = useState(0); const handleChange = (event: React.ChangeEvent) => { setExam(parseInt(event.target.value)); @@ -88,6 +71,28 @@ const CredExamShop = () => { ); location.href = "/account/checkout"; }; + useEffect(() => { + const tempExamProducts = []; + console.log(ExamData); + if(ExamData === undefined) { + return; + } + for (const exam of ExamData) { + for (const examDescription of ExamProductDescriptions) { + if (exam.id === examDescription.id) { + exam.metadata = examDescription.metadata; + tempExamProducts.push(exam); + } + } + } + setExamProducts(tempExamProducts); + console.log(ExamData); + console.log(tempExamProducts); + }, [ExamData]); + if (isLoading) { + return ; + } + return ( <> @@ -118,7 +123,7 @@ const CredExamShop = () => { { > {

- {ExamProducts[exam].name} + {ExamProducts[exam]?.name}

diff --git a/static/js/src/advantage/credentials/components/CredKeyShop/CredKeyShop.tsx b/static/js/src/advantage/credentials/components/CredKeyShop/CredKeyShop.tsx index fcdd5f50b17..9f73452f301 100644 --- a/static/js/src/advantage/credentials/components/CredKeyShop/CredKeyShop.tsx +++ b/static/js/src/advantage/credentials/components/CredKeyShop/CredKeyShop.tsx @@ -48,7 +48,11 @@ const CredKeyShop = () => { location.href = "/account/checkout"; }; useEffect(() => { - setCUEExamKey(keyProducts?.find((product: Product) => product.id === "cue-activation-key")); + setCUEExamKey( + keyProducts?.find( + (product: Product) => product.id === "cue-activation-key" + ) + ); }, [keyProducts]); return ( <> @@ -95,9 +99,19 @@ const CredKeyShop = () => { )} - {isLoading?:} + {isLoading ? ( + + ) : ( + + )} diff --git a/static/js/src/advantage/subscribe/blender/utils/utils.ts b/static/js/src/advantage/subscribe/blender/utils/utils.ts index 775f9914ada..86b3ffc6d95 100644 --- a/static/js/src/advantage/subscribe/blender/utils/utils.ts +++ b/static/js/src/advantage/subscribe/blender/utils/utils.ts @@ -29,6 +29,7 @@ export type Product = { id: ProductIDs; productID: string; marketplace: UserSubscriptionMarketplace; + metadata?: Array<{ key: string; value: string }>; }; export type ProductListings = { diff --git a/webapp/app.py b/webapp/app.py index ffc2ac48d2a..73f00fa0363 100644 --- a/webapp/app.py +++ b/webapp/app.py @@ -81,6 +81,7 @@ cred_syllabus_data, cred_your_exams, get_activation_keys, + get_exam_products, get_filtered_webhook_responses, get_issued_badges, get_key_products, @@ -1131,6 +1132,9 @@ def takeovers_index(): app.add_url_rule("/credentials/cancel-exam", view_func=cred_cancel_exam) app.add_url_rule("/credentials/assessments", view_func=cred_assessments) app.add_url_rule("/credentials/exam", view_func=cred_exam) +app.add_url_rule( + "/credentials/exam/products", view_func=get_exam_products, methods=["GET"] +) app.add_url_rule( "/credentials/exit-survey", view_func=cred_submit_form, diff --git a/webapp/shop/cred/views.py b/webapp/shop/cred/views.py index a0315ea6157..7accd632c03 100644 --- a/webapp/shop/cred/views.py +++ b/webapp/shop/cred/views.py @@ -734,3 +734,22 @@ def get_key_products(ua_contracts_api, **kwargs): if listing["productID"].endswith("key") ] return flask.jsonify(key_products) + + +@shop_decorator(area="cred", permission="user", response="json") +def get_exam_products(ua_contracts_api, **kwargs): + listings = ua_contracts_api.get_product_listings("canonical-cube").get( + "productListings" + ) + exam_products = [ + { + "id": listing["productID"], + "longId": listing["id"], + "period": listing["period"], + "marketplace": listing["marketplace"], + "name": listing["name"], + "price": listing["price"], + } + for listing in listings + ] + return flask.jsonify(exam_products)