From 165998cf1cca3baef43b6e589cbd881de4a9254e Mon Sep 17 00:00:00 2001 From: Luka Radenovic Date: Mon, 6 Jun 2022 12:14:30 +0200 Subject: [PATCH 1/5] Dashboard logout should trigger OAuth logout endpoint --- src/common/util/domain.ts | 3 +++ src/common/util/index.ts | 5 +++-- src/components/Header/Header.tsx | 20 ++++++++++++++++++++ 3 files changed, 26 insertions(+), 2 deletions(-) create mode 100644 src/common/util/domain.ts diff --git a/src/common/util/domain.ts b/src/common/util/domain.ts new file mode 100644 index 0000000..7152af5 --- /dev/null +++ b/src/common/util/domain.ts @@ -0,0 +1,3 @@ +export function getDomainName(hostName: string) { + return hostName.substring(hostName.lastIndexOf('.', hostName.lastIndexOf('.') - 1) + 1); +} diff --git a/src/common/util/index.ts b/src/common/util/index.ts index 40a831a..da95403 100644 --- a/src/common/util/index.ts +++ b/src/common/util/index.ts @@ -1,2 +1,3 @@ -export { isTouched } from './is-touched'; -export { addParamsToLink } from './add-params-to-link'; +export * from './is-touched'; +export * from './add-params-to-link'; +export * from './domain'; diff --git a/src/components/Header/Header.tsx b/src/components/Header/Header.tsx index a58e2d8..facd338 100644 --- a/src/components/Header/Header.tsx +++ b/src/components/Header/Header.tsx @@ -2,6 +2,7 @@ import React, { Fragment, useState } from 'react'; import { Disclosure, Menu, Transition } from '@headlessui/react'; import { MenuIcon, XIcon } from '@heroicons/react/outline'; import { useAuth } from 'src/services/auth'; +import { getDomainName } from 'src/common/util'; import Gravatar from 'react-gravatar'; import { Link, useLocation } from 'react-router-dom'; import clsx from 'clsx'; @@ -31,6 +32,24 @@ const Header: React.FC = () => { const [currentUserModal, setCurrentUserModal] = useState(false); const { logOut, currentUser, isAdmin } = useAuth(); + const singOutUrl = () => { + const { hostname } = window.location; + const domain = getDomainName(window.location.hostname); + let url = `https://sso.${domain}/oauth2/sessions/logout`; + + // This is a fix so it can work with dashboard.init.stackspin.net + if (hostname.includes('init')) { + url = `https://sso.init.${domain}/oauth2/sessions/logout`; + } + + // This is a fix so it can work locally + if (hostname.includes('localhost')) { + url = 'https://sso.init.stackspin.net/oauth2/sessions/logout'; + } + + return url; + }; + const { pathname } = useLocation(); const currentUserModalOpen = () => { @@ -120,6 +139,7 @@ const Header: React.FC = () => { {({ active }) => ( logOut()} + href={singOutUrl()} className={classNames( active ? 'bg-gray-100 cursor-pointer' : '', 'block px-4 py-2 text-sm text-gray-700 cursor-pointer', From e5f06fc7b069c55f9489b4c76771596f0537ed70 Mon Sep 17 00:00:00 2001 From: Luka Radenovic Date: Thu, 9 Jun 2022 11:10:28 +0200 Subject: [PATCH 2/5] Add hydra public url to environment --- .env.example | 2 ++ src/components/Header/Header.tsx | 25 +++++-------------------- 2 files changed, 7 insertions(+), 20 deletions(-) create mode 100644 .env.example diff --git a/.env.example b/.env.example new file mode 100644 index 0000000..dad0d4f --- /dev/null +++ b/.env.example @@ -0,0 +1,2 @@ +REACT_APP_API_URL=http://127.0.0.1:5000/api/v1 +REACT_APP_HYDRA_PUBLIC_URL=https://sso.init.stackspin.net \ No newline at end of file diff --git a/src/components/Header/Header.tsx b/src/components/Header/Header.tsx index facd338..db86596 100644 --- a/src/components/Header/Header.tsx +++ b/src/components/Header/Header.tsx @@ -2,7 +2,6 @@ import React, { Fragment, useState } from 'react'; import { Disclosure, Menu, Transition } from '@headlessui/react'; import { MenuIcon, XIcon } from '@heroicons/react/outline'; import { useAuth } from 'src/services/auth'; -import { getDomainName } from 'src/common/util'; import Gravatar from 'react-gravatar'; import { Link, useLocation } from 'react-router-dom'; import clsx from 'clsx'; @@ -25,6 +24,8 @@ function filterNavigationByDashboardRole(isAdmin: boolean) { return navigation.filter((item) => !item.requiresAdmin); } +const HYDRA_URL = process.env.REACT_APP_HYDRA_PUBLIC_URL; + // eslint-disable-next-line @typescript-eslint/no-empty-interface interface HeaderProps {} @@ -32,24 +33,6 @@ const Header: React.FC = () => { const [currentUserModal, setCurrentUserModal] = useState(false); const { logOut, currentUser, isAdmin } = useAuth(); - const singOutUrl = () => { - const { hostname } = window.location; - const domain = getDomainName(window.location.hostname); - let url = `https://sso.${domain}/oauth2/sessions/logout`; - - // This is a fix so it can work with dashboard.init.stackspin.net - if (hostname.includes('init')) { - url = `https://sso.init.${domain}/oauth2/sessions/logout`; - } - - // This is a fix so it can work locally - if (hostname.includes('localhost')) { - url = 'https://sso.init.stackspin.net/oauth2/sessions/logout'; - } - - return url; - }; - const { pathname } = useLocation(); const currentUserModalOpen = () => { @@ -59,6 +42,8 @@ const Header: React.FC = () => { const navigationItems = filterNavigationByDashboardRole(isAdmin); + const singOutUrl = `${HYDRA_URL}/oauth2/sessions/logout`; + return ( <> @@ -139,7 +124,7 @@ const Header: React.FC = () => { {({ active }) => ( logOut()} - href={singOutUrl()} + href={singOutUrl} className={classNames( active ? 'bg-gray-100 cursor-pointer' : '', 'block px-4 py-2 text-sm text-gray-700 cursor-pointer', From af685ce3cc3de3c59a0719e76960aafa204fd4a7 Mon Sep 17 00:00:00 2001 From: Luka Radenovic Date: Fri, 10 Jun 2022 09:39:24 +0200 Subject: [PATCH 3/5] Remove domain helper and fix typos --- src/common/util/domain.ts | 3 --- src/components/Header/Header.tsx | 4 ++-- 2 files changed, 2 insertions(+), 5 deletions(-) delete mode 100644 src/common/util/domain.ts diff --git a/src/common/util/domain.ts b/src/common/util/domain.ts deleted file mode 100644 index 7152af5..0000000 --- a/src/common/util/domain.ts +++ /dev/null @@ -1,3 +0,0 @@ -export function getDomainName(hostName: string) { - return hostName.substring(hostName.lastIndexOf('.', hostName.lastIndexOf('.') - 1) + 1); -} diff --git a/src/components/Header/Header.tsx b/src/components/Header/Header.tsx index db86596..0faf437 100644 --- a/src/components/Header/Header.tsx +++ b/src/components/Header/Header.tsx @@ -42,7 +42,7 @@ const Header: React.FC = () => { const navigationItems = filterNavigationByDashboardRole(isAdmin); - const singOutUrl = `${HYDRA_URL}/oauth2/sessions/logout`; + const signOutUrl = `${HYDRA_URL}/oauth2/sessions/logout`; return ( <> @@ -124,7 +124,7 @@ const Header: React.FC = () => { {({ active }) => ( logOut()} - href={singOutUrl} + href={signOutUrl} className={classNames( active ? 'bg-gray-100 cursor-pointer' : '', 'block px-4 py-2 text-sm text-gray-700 cursor-pointer', From 448518dade06cad0bcb39d596c4ff89a74cc8ecc Mon Sep 17 00:00:00 2001 From: Luka Radenovic Date: Fri, 10 Jun 2022 09:44:29 +0200 Subject: [PATCH 4/5] Fix build error --- src/common/util/index.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/src/common/util/index.ts b/src/common/util/index.ts index da95403..eb165cf 100644 --- a/src/common/util/index.ts +++ b/src/common/util/index.ts @@ -1,3 +1,2 @@ export * from './is-touched'; export * from './add-params-to-link'; -export * from './domain'; From bcd854dcca737b06c17b00de8c1d1c67a228b10f Mon Sep 17 00:00:00 2001 From: Maarten de Waard Date: Fri, 10 Jun 2022 09:46:38 +0200 Subject: [PATCH 5/5] Add "REACT_APP_HYDRA_PUBLIC_URL" variable to deployment --- deployment/helmchart/templates/configmaps.yaml | 2 ++ 1 file changed, 2 insertions(+) diff --git a/deployment/helmchart/templates/configmaps.yaml b/deployment/helmchart/templates/configmaps.yaml index 6d02f35..a6c9346 100644 --- a/deployment/helmchart/templates/configmaps.yaml +++ b/deployment/helmchart/templates/configmaps.yaml @@ -19,6 +19,8 @@ data: KRATOS_PUBLIC_URL: {{ .Values.backend.kratos.publicUrl }} KRATOS_ADMIN_URL: {{ .Values.backend.kratos.adminUrl }} HYDRA_PUBLIC_URL: {{ .Values.backend.oidc.baseUrl }} + # React can only read this env variable if it's prepended with REACT_APP + REACT_APP_HYDRA_PUBLIC_URL: {{ .Values.backend.oidc.baseUrl }} HYDRA_ADMIN_URL: {{ .Values.backend.hydra.adminUrl }} LOGIN_PANEL_URL: {{ .Values.backend.loginPanelUrl }} DATABASE_URL: {{ .Values.backend.databaseUrl }}