From 3e5406efb4eb08c5a2e52f90494488144b3b9cac Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?G=C3=B8ran=20Brekke=20Svaland?= Date: Wed, 5 Jul 2023 11:35:42 +0200 Subject: [PATCH] first get allProjectsQuery is working --- frontend-dev/package-lock.json | 34 +++++++++---------- frontend-dev/src/lib/keycloak.ts | 27 ++++++++------- frontend-dev/src/queries/get_all_projects.ts | 6 +++- frontend-dev/src/routes/projects/+page.svelte | 23 ++++++++----- frontend-dev/src/stores/stores.ts | 4 ++- 5 files changed, 53 insertions(+), 41 deletions(-) diff --git a/frontend-dev/package-lock.json b/frontend-dev/package-lock.json index 6de4fb8e..39ff5ba3 100644 --- a/frontend-dev/package-lock.json +++ b/frontend-dev/package-lock.json @@ -40,6 +40,15 @@ "vitest": "^0.25.3" } }, + "node_modules/@aashutoshrathi/word-wrap": { + "version": "1.2.6", + "resolved": "https://registry.npmjs.org/@aashutoshrathi/word-wrap/-/word-wrap-1.2.6.tgz", + "integrity": "sha512-1Yjs2SvM8TflER/OD3cOjhWWOZb58A2t7wpE2S9XfBYTiIl+XFhQG2bjy4Pu1I+EAlCNUzRDYDdFwFYUKvXcIA==", + "dev": true, + "engines": { + "node": ">=0.10.0" + } + }, "node_modules/@alloc/quick-lru": { "version": "5.2.0", "resolved": "https://registry.npmjs.org/@alloc/quick-lru/-/quick-lru-5.2.0.tgz", @@ -2699,17 +2708,17 @@ } }, "node_modules/optionator": { - "version": "0.9.1", - "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.1.tgz", - "integrity": "sha512-74RlY5FCnhq4jRxVUPKDaRwrVNXMqsGsiW6AJw4XK8hmtm10wC0ypZBLw5IIp85NZMr91+qd1RvvENwg7jjRFw==", + "version": "0.9.3", + "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.3.tgz", + "integrity": "sha512-JjCoypp+jKn1ttEFExxhetCKeJt9zhAgAve5FXHixTvFDW/5aEktX9bufBKLRRMdU7bNtpLfcGu94B3cdEJgjg==", "dev": true, "dependencies": { + "@aashutoshrathi/word-wrap": "^1.2.3", "deep-is": "^0.1.3", "fast-levenshtein": "^2.0.6", "levn": "^0.4.1", "prelude-ls": "^1.2.1", - "type-check": "^0.4.0", - "word-wrap": "^1.2.3" + "type-check": "^0.4.0" }, "engines": { "node": ">= 0.8.0" @@ -3227,9 +3236,9 @@ } }, "node_modules/semver": { - "version": "7.5.1", - "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.1.tgz", - "integrity": "sha512-Wvss5ivl8TMRZXXESstBA4uR5iXgEN/VC5/sOcuXdVLzcdkz4HWetIoRfG5gb5X+ij/G9rw9YoGn3QoQ8OCSpw==", + "version": "7.5.3", + "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.3.tgz", + "integrity": "sha512-QBlUtyVk/5EeHbi7X0fw6liDZc7BBmEaSYn01fMU1OUYbf6GPsbTtd8WmnqbI20SeycoHSeiybkE/q1Q+qlThQ==", "dev": true, "dependencies": { "lru-cache": "^6.0.0" @@ -4079,15 +4088,6 @@ "node": ">= 8" } }, - "node_modules/word-wrap": { - "version": "1.2.3", - "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.3.tgz", - "integrity": "sha512-Hz/mrNwitNRh/HUAtM/VT/5VH+ygD6DV7mYKZAtHOrbs8U7lvPS6xf7EJKMF0uW1KJCl0H701g3ZGus+muE5vQ==", - "dev": true, - "engines": { - "node": ">=0.10.0" - } - }, "node_modules/wrappy": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz", diff --git a/frontend-dev/src/lib/keycloak.ts b/frontend-dev/src/lib/keycloak.ts index 653b6863..adf09260 100644 --- a/frontend-dev/src/lib/keycloak.ts +++ b/frontend-dev/src/lib/keycloak.ts @@ -1,5 +1,5 @@ -// import { GraphQLClient } from 'graphql-request'; -// import { graphQLClient, username } from '../stores/stores.js'; +import { GraphQLClient } from 'graphql-request'; +import { graphQLClient, username } from '../stores/stores.js'; import Keycloak from 'keycloak-js'; import { keycloakHandler } from '../stores/stores.js'; import { browser } from '$app/environment'; @@ -29,13 +29,16 @@ async function internalInitKeycloak(): Promise { if (!get(keycloakHandler).idTokenParsed) { throw new Error("Keycloak didn't return a valid idTokenParsed"); } - if (typeof get(keycloakHandler)?.idTokenParsed.preferred_username !== 'string') { - throw new TypeError("Keycloak didn't return a valid preferred_username"); - } - // TODO: initialize graphqlclient and save in store - // username.set(keycloak.idTokenParsed.preferred_username); + // TODO: Aleena check uncaught (in promise) cannot read properties of endefined (reading 'preferred_username') + // if (typeof get(keycloakHandler)?.idTokenParsed.preferred_username !== 'string') { + // throw new TypeError("Keycloak didn't return a valid preferred_username"); + //} + // TODO: Aleena initialize graphqlclient and save in store + // username.set((keycloakHandler as unknown as Keycloak).idTokenParsed.preferred_username); + username.set("testuser"); + + const graphqlUrl = "http://localhost:8087/graphql"; // TODO - // let graphqlUrl; // if (config.SIM_PIPE_CONTROLLER_URL) { // graphqlUrl = config.SIM_PIPE_CONTROLLER_URL; // } else if (/^localhost(:\d+)?$/.test(window.location.host)) { @@ -43,11 +46,9 @@ async function internalInitKeycloak(): Promise { // } else { // graphqlUrl = '/graphql'; // } - // graphQLClient.set( - // new GraphQLClient(graphqlUrl, { - // headers: requestHeaders, - // }), - // ); + graphQLClient.set( + new GraphQLClient(graphqlUrl, {}), + ); } export default async function initKeycloak(): Promise { diff --git a/frontend-dev/src/queries/get_all_projects.ts b/frontend-dev/src/queries/get_all_projects.ts index bd6e566d..d9f57336 100644 --- a/frontend-dev/src/queries/get_all_projects.ts +++ b/frontend-dev/src/queries/get_all_projects.ts @@ -2,7 +2,11 @@ import { gql } from 'graphql-request'; const allProjectsQuery = gql` query projects { - projects + projects { + name + id + createdAt + } } `; diff --git a/frontend-dev/src/routes/projects/+page.svelte b/frontend-dev/src/routes/projects/+page.svelte index e147e1eb..244d7ca9 100644 --- a/frontend-dev/src/routes/projects/+page.svelte +++ b/frontend-dev/src/routes/projects/+page.svelte @@ -6,15 +6,19 @@ import { projectsList } from '../../stores/stores.js'; import initKeycloak from '../../lib/keycloak.js'; import type { Project } from '../../types.js'; + import { graphQLClient } from '../../stores/stores.js'; + import allProjectsQuery from '../../queries/get_all_projects.js'; + import { get } from 'svelte/store'; const getProjectsList = async (): Promise => { await initKeycloak(); - // const response = await get(graphQLClient).request<{ - // All_Projects: { - // projects: Project[]; - // }; - // }>(all_projects_query); - // return response.projects; + const response = await get(graphQLClient).request<{ + All_Projects: { + projects: Project[]; + }; + }>(allProjectsQuery); + //console.log(response.projects); + return response.projects; // TODO:replace with graphql call return projects; }; @@ -96,9 +100,10 @@ handleCheckboxClick(event)} /> {project.name} - {project.created} - {project.dry_run_count} - {project.simulations_count} + {project.createdAt} + + "NaN" + "NaN" {/each} diff --git a/frontend-dev/src/stores/stores.ts b/frontend-dev/src/stores/stores.ts index 3cf1d301..a91b4d29 100644 --- a/frontend-dev/src/stores/stores.ts +++ b/frontend-dev/src/stores/stores.ts @@ -3,11 +3,13 @@ import type { GraphQLClient } from 'graphql-request'; import type Keycloak from 'keycloak-js'; import type { Project } from '../types.js'; -export const graphQlClient = writable(); +export const graphQLClient = writable(); export const keycloakHandler = writable();; export const projectsList = writable(); +export const username = writable("username"); + // TODO: remove; temporary list to keep dry runs [samples used in frontend until api is ready] export const dry_runs = { "name": "TLU",