From 46f83c121a17c393e9d6a532b0e7fc0e6403704b Mon Sep 17 00:00:00 2001 From: Christian Samaniego <199278128+christiansamaniego-okta@users.noreply.github.com> Date: Mon, 22 Sep 2025 17:42:55 -0500 Subject: [PATCH 1/9] remove modals and style info message --- src/app/[language]/page.tsx | 17 -- .../headers/header/header.module.scss | 3 + .../hero/hero-banner-modal.module.scss | 147 ------------------ .../components/hero/hero-banner.component.tsx | 86 ---------- .../hero/hero-info-banner.component.tsx | 76 --------- .../hero/hero-warning-banner.component.tsx | 31 ---- .../common/components/hero/hero.component.tsx | 63 +++----- .../common/components/hero/hero.module.scss | 96 ++++-------- .../page-layout/page-layout.module.scss | 2 +- .../home-page/home-page.component.tsx | 15 +- src/features/home/config/home.config.ts | 2 - .../home/values/hero-modal-state.values.ts | 4 - .../home/values/hero-modal-type.values.ts | 4 - .../models/home-dictionary.model.ts | 11 -- src/libs/theme/styles/_variables.scss | 4 +- 15 files changed, 64 insertions(+), 497 deletions(-) delete mode 100644 src/features/common/components/hero/hero-banner-modal.module.scss delete mode 100644 src/features/common/components/hero/hero-banner.component.tsx delete mode 100644 src/features/common/components/hero/hero-info-banner.component.tsx delete mode 100644 src/features/common/components/hero/hero-warning-banner.component.tsx delete mode 100644 src/features/home/config/home.config.ts delete mode 100644 src/features/home/values/hero-modal-state.values.ts delete mode 100644 src/features/home/values/hero-modal-type.values.ts diff --git a/src/app/[language]/page.tsx b/src/app/[language]/page.tsx index 4793d8e6..ef6a1637 100644 --- a/src/app/[language]/page.tsx +++ b/src/app/[language]/page.tsx @@ -16,12 +16,6 @@ import { DECODED_PAYLOAD_DESCRIPTION_KEY, DECODED_PAYLOAD_FORMAT_KEY, } from "@/features/decoder/config/decoder.config"; -import { - JWT_INFO_STATE_KEY, - JWT_WARNING_STATE_KEY, -} from "@/features/home/config/home.config"; -import { HeroModalStateValues } from "@/features/home/values/hero-modal-state.values"; -import { getSanitizedHeroModalStateValue } from "@/features/common/services/hero.utils"; import { getSanitizedDescriptionVisibilityValue } from "@/features/common/services/decoder.utils"; import { ClaimDescriptionVisibilityValues } from "@/features/common/values/claim-description-visibility.values"; import { getSanitizedDebuggerModeValues } from "@/features/common/services/debugger.utils"; @@ -60,15 +54,6 @@ export default function Home({ cookies().get(DECODED_PAYLOAD_DESCRIPTION_KEY)?.value || null, ) || ClaimDescriptionVisibilityValues.VISIBLE; - const jwtInfoState = - getSanitizedHeroModalStateValue( - cookies().get(JWT_INFO_STATE_KEY)?.value || null, - ) || HeroModalStateValues.OPEN; - const jwtWarningState = - getSanitizedHeroModalStateValue( - cookies().get(JWT_WARNING_STATE_KEY)?.value || null, - ) || HeroModalStateValues.OPEN; - const debuggerInitialMode: DebuggerModeValues = getSanitizedDebuggerModeValues( cookies().get(DEBUGGER_MODE_KEY)?.value || null, @@ -81,8 +66,6 @@ export default function Home({ decodedPayloadInitialTabId={decodedPayloadInitialTabId} decodedHeaderDescriptionVisibility={decodedHeaderDescriptionVisibility} decodedPayloadDescriptionVisibility={decodedPayloadDescriptionVisibility} - jwtInfoState={jwtInfoState} - jwtWarningState={jwtWarningState} // debuggerInitialMode={debuggerInitialMode} /> ); diff --git a/src/features/common/components/headers/header/header.module.scss b/src/features/common/components/headers/header/header.module.scss index 3f27108d..8843eb04 100644 --- a/src/features/common/components/headers/header/header.module.scss +++ b/src/features/common/components/headers/header/header.module.scss @@ -21,6 +21,9 @@ @media #{$breakpoint-dimension-sm} { display: block; } + @media #{$breakpoint-dimension-xl} { + max-width: $inner-content-grid-max-width; + } } .wrapper { diff --git a/src/features/common/components/hero/hero-banner-modal.module.scss b/src/features/common/components/hero/hero-banner-modal.module.scss deleted file mode 100644 index 3c40a783..00000000 --- a/src/features/common/components/hero/hero-banner-modal.module.scss +++ /dev/null @@ -1,147 +0,0 @@ -@use "@/libs/theme/styles/variables" as *; -@use "@/libs/theme/styles/mixins" as *; - -.modal { - position: relative; - display: block; - flex-direction: column; - align-content: flex-start; - justify-content: center; - grid-column: span 6; - font-size: 0.875rem; - line-height: 1.375rem; - border-radius: 0.25rem; - - letter-spacing: 0.21px; - padding: 0.875rem; - height: 100%; - - & strong { - font-weight: 500; - text-decoration: underline; - } - - &[data-state="closed"] { - height: fit-content; - } - - &[data-type="info"] { - background-color: var(--color_bg_state_info_subtle); - color: var(--color_fg_on_state_info_subtle); - - & strong { - color: var(--color_fg_on_state_info_subtle); - } - - .modal__control { - color: var(--color_fg_on_state_info_subtle); - } - } - - &[data-type="warning"] { - background: var(--color_bg_state_caution_subtle); - color: var(--color_fg_on_state_caution_subtle); - - & strong { - color: var(--color_fg_on_state_caution_subtle); - } - - .modal__control { - color: var(--color_fg_on_state_caution_subtle); - } - } -} - -.modal__control { - position: absolute; - top: 0.25rem; - right: 0.375rem; - display: flex; - align-items: center; - justify-content: center; - background-color: transparent; - border: none; - - font-size: 1.25rem; - cursor: pointer; - - height: 1rem; - width: 1rem; - - &[data-state="open"] { - & .modal__controlIcon { - display: inline-block; - transform: rotate(45deg); - } - } - - &:focus-visible { - outline: solid 1px var(--color_border_focus); - outline-offset: 0.125rem; - border-radius: 0.125rem; - } -} - -.modal__text { - grid-column: 1 / -1; - width: 100%; - gap: 1rem; - font-size: 0.875rem; - line-height: 1.25rem; - font-weight: 400; - :global(html[lang="ja"]) & { - @include LocaleLineHeight("ja", 0.875rem); - } - - & a { - text-decoration: underline; - font-weight: 500; - - &:focus-visible { - outline: solid 1px var(--color_border_focus); - outline-offset: 0.125rem; - border-radius: 0.125rem; - } - } -} - -.modal__cta { - display: flex; - flex-direction: column; - gap: 1rem; - - @media #{$breakpoint-dimension-xs-plus} { - flex-direction: row; - gap: 1.5rem; - } -} - -.modal__ctaLink { - display: flex; - padding: 0; - justify-content: center; - align-items: center; - gap: 0.5rem; - align-self: stretch; - border-radius: 0.375rem; - text-decoration: underline; - font-size: 0.875rem; - line-height: 1.375rem; - font-style: normal; - font-weight: 500; - letter-spacing: 0.2px; - - :global(html[lang="ja"]) & { - @include LocaleLineHeight("ja", 1rem); - } - - @media #{$breakpoint-dimension-sm} { - width: fit-content; - } - - &:focus-visible { - outline: solid 1px var(--color_border_focus); - outline-offset: 0.125rem; - border-radius: 0.125rem; - } -} diff --git a/src/features/common/components/hero/hero-banner.component.tsx b/src/features/common/components/hero/hero-banner.component.tsx deleted file mode 100644 index 12f4b7b5..00000000 --- a/src/features/common/components/hero/hero-banner.component.tsx +++ /dev/null @@ -1,86 +0,0 @@ -import React, { useRef, useState } from "react"; -import styles from "./hero-banner-modal.module.scss"; -import { HeroModalStateValues } from "@/features/home/values/hero-modal-state.values"; -import Cookies from "js-cookie"; -import { HeroModalTypeValues } from "@/features/home/values/hero-modal-type.values"; -import { useButton } from "@react-aria/button"; - -interface HeroBannerComponentProps { - initialModalState: HeroModalStateValues; - modalType: HeroModalTypeValues; - modalCookieKey: string; - modalSummary: string; - modalContent: React.ReactNode; - modalCta: React.ReactNode | null; -} - -export const HeroBannerComponent: React.FC = ({ - initialModalState, - modalType, - modalCookieKey, - modalSummary, - modalContent, - modalCta, -}) => { - const buttonRef = useRef(null); - const [modalState, setModalState] = - useState(initialModalState); - - const { buttonProps } = useButton( - { - elementType: "span", - preventFocusOnPress: true, - }, - buttonRef, - ); - - const toggleVisibility = () => { - setModalState((prevState) => { - Cookies.set( - modalCookieKey, - prevState === HeroModalStateValues.OPEN - ? HeroModalStateValues.CLOSED - : HeroModalStateValues.OPEN, - { - secure: true, - }, - ); - - return prevState === HeroModalStateValues.OPEN - ? HeroModalStateValues.CLOSED - : HeroModalStateValues.OPEN; - }); - }; - - return ( -

- {modalState === HeroModalStateValues.CLOSED && ( - {modalSummary} - )} - - {modalState === HeroModalStateValues.OPEN && ( - <> - {modalContent} - {modalCta} - - )} -

- ); -}; diff --git a/src/features/common/components/hero/hero-info-banner.component.tsx b/src/features/common/components/hero/hero-info-banner.component.tsx deleted file mode 100644 index 5e806808..00000000 --- a/src/features/common/components/hero/hero-info-banner.component.tsx +++ /dev/null @@ -1,76 +0,0 @@ -import React from "react"; -import styles from "./hero-banner-modal.module.scss"; -import { HomeDictionaryModel } from "@/features/localization/models/home-dictionary.model"; -import { HeroModalStateValues } from "@/features/home/values/hero-modal-state.values"; -import { JWT_INFO_STATE_KEY } from "@/features/home/config/home.config"; -import Link from "next/link"; -import { clsx } from "clsx"; -import { createUrlPath } from "@/libs/utils/path.utils"; -import { DEFAULT_LANGUAGE_CODE } from "@/features/localization/localization.config"; -import { HeroBannerComponent } from "@/features/common/components/hero/hero-banner.component"; -import { HeroModalTypeValues } from "@/features/home/values/hero-modal-type.values"; - -interface HeroInfoBannerComponentProps { - languageCode: string; - dictionary: HomeDictionaryModel["info"]; - modalState: HeroModalStateValues; -} - -export const HeroInfoBannerComponent: React.FC< - HeroInfoBannerComponentProps -> = ({ languageCode, dictionary, modalState }) => { - const ctaPath = createUrlPath([ - languageCode === DEFAULT_LANGUAGE_CODE ? "" : languageCode, - dictionary.ctaButton ? dictionary.ctaButton.path : "", - ]); - const secondaryCtaPath = createUrlPath([ - languageCode === DEFAULT_LANGUAGE_CODE ? "" : languageCode, - dictionary.secondaryCtaButton ? dictionary.secondaryCtaButton.path : "", - ]); - - const description = dictionary.description.split( - dictionary.resources.spec.name, - ); - - return ( - - {description[0]} - - RFC 7519 - - {description[1]} - - } - modalCta={ - <> - {dictionary.ctaButton && ( - - {dictionary.ctaButton.label} - - )} - {dictionary.secondaryCtaButton && ( - - {dictionary.secondaryCtaButton.label} - - )} - - } - /> - ); -}; diff --git a/src/features/common/components/hero/hero-warning-banner.component.tsx b/src/features/common/components/hero/hero-warning-banner.component.tsx deleted file mode 100644 index 3bbee194..00000000 --- a/src/features/common/components/hero/hero-warning-banner.component.tsx +++ /dev/null @@ -1,31 +0,0 @@ -import React from "react"; -import { HomeDictionaryModel } from "@/features/localization/models/home-dictionary.model"; -import { HeroModalStateValues } from "@/features/home/values/hero-modal-state.values"; -import { JWT_WARNING_STATE_KEY } from "@/features/home/config/home.config"; -import { HeroBannerComponent } from "@/features/common/components/hero/hero-banner.component"; -import { HeroModalTypeValues } from "@/features/home/values/hero-modal-type.values"; - -type HeroWarningBannerComponentProps = { - dictionary: HomeDictionaryModel["warning"]; - modalState: HeroModalStateValues; -}; - -export const HeroWarningBannerComponent: React.FC< - HeroWarningBannerComponentProps -> = ({ dictionary, modalState }) => { - return ( - - {dictionary.title}{" "} - {dictionary.description} - - } - modalCta={null} - /> - ); -}; diff --git a/src/features/common/components/hero/hero.component.tsx b/src/features/common/components/hero/hero.component.tsx index b3c57ba8..2f709d8c 100644 --- a/src/features/common/components/hero/hero.component.tsx +++ b/src/features/common/components/hero/hero.component.tsx @@ -1,60 +1,47 @@ "use client"; import React from "react"; -import { clsx } from "clsx"; import { BoxComponent } from "@/features/common/components/box/box.component"; import styles from "./hero.module.scss"; -import { HeroMetadataModel } from "@/features/common/models/hero-metadata.model"; -import { getLocalizedSecondaryFont } from "@/libs/theme/fonts"; -import { HeroWarningBannerComponent } from "@/features/common/components/hero/hero-warning-banner.component"; import { HomeDictionaryModel } from "@/features/localization/models/home-dictionary.model"; -import { HeroModalStateValues } from "@/features/home/values/hero-modal-state.values"; -import { HeroInfoBannerComponent } from "@/features/common/components/hero/hero-info-banner.component"; +import Link from "next/link"; interface HeroComponentProps { languageCode: string; - dictionary: HeroMetadataModel; - infoBanner: { - dictionary: HomeDictionaryModel["info"]; - state: HeroModalStateValues; - }; - warningBanner: { - dictionary: HomeDictionaryModel["warning"]; - state: HeroModalStateValues; - }; + dictionary: HomeDictionaryModel["info"]; } -export const HeroComponent: React.FC = ({ - languageCode, - dictionary, - infoBanner, - warningBanner, -}) => { +export const HeroComponent: React.FC = ({ dictionary }) => { + const description = dictionary.description.split( + dictionary.resources.spec.name + ); + return ( -

- {dictionary.title} -

- - +

+ + { + <> + {description[0]} + + RFC 7519 + + {description[1]} + + } + +

+
); }; diff --git a/src/features/common/components/hero/hero.module.scss b/src/features/common/components/hero/hero.module.scss index 4052a4ba..69476e93 100644 --- a/src/features/common/components/hero/hero.module.scss +++ b/src/features/common/components/hero/hero.module.scss @@ -6,89 +6,57 @@ position: relative; overflow: hidden; - @media #{$breakpoint-dimension-xxs} { - &:before { - background-size: cover; - } - } - @media #{$breakpoint-dimension-md} { - background-color: unset; - - :global(body[data-theme="light"]) & { - background-color: unset; - } - :global(body[data-theme="system-light"]) & { - background-color: unset; - } - - &:before { - background: unset; - } - - :global(body[data-theme="light"]) &:before { - background: unset; - } - :global(body[data-theme="system-light"]) &:before { - background: unset; - } - - &:after { - display: none; - background: none; - } + margin-bottom: 2rem; } } -.wrapper { - @include ExtendedGrid; - justify-content: center; - - border-radius: 0; - overflow: hidden; -} - .content { @include InnerContentFlex; + flex-direction: column; justify-content: center; + align-items: center; overflow: hidden; - flex-direction: column; - - @media #{$breakpoint-dimension-sm} { - @include InnerContentGrid; - } } .hero { z-index: 1; - width: 100%; display: flex; - flex-direction: column; + justify-content: center; + width: 100%; padding: 1.25rem 0; - gap: 1rem; + text-align: center; @media #{$breakpoint-dimension-sm} { - grid-column: 1 / -1; - display: grid; - grid-template-columns: subgrid; - gap: 1rem; + padding: 0.5rem 0; } } -.hero__title { - grid-column: 1 / -1; - width: 100%; - margin: 0; - flex-direction: column; - align-items: center; - font-size: 1.5rem; - line-height: 2rem; - color: var(--color_fg_bold); - font-variant-numeric: lining-nums proportional-nums; - padding: 0.5rem 0; - text-align: center; +.modal { + max-width: 608px; + padding: 2.5rem 0; +} + +.modal__text { + color: var(--color_fg_default); + font-size: .875rem; + letter-spacing: .21px; + line-height: 1.25rem;; - :global(html[lang="ja"]) & { - @include LocaleLineHeight("ja", 1.5rem); + a { + text-decoration: underline; + font-weight: 500; } } + +.divider { + display: none; + + @media #{$breakpoint-dimension-md} { + display: block; + width: 40rem; + height: 1px; + background: linear-gradient(to right, transparent, var(--color_border_default), transparent); + border: 0; + } +} \ No newline at end of file diff --git a/src/features/common/components/layout/page-layout/page-layout.module.scss b/src/features/common/components/layout/page-layout/page-layout.module.scss index 4cb6057a..bc84fdad 100644 --- a/src/features/common/components/layout/page-layout/page-layout.module.scss +++ b/src/features/common/components/layout/page-layout/page-layout.module.scss @@ -9,7 +9,7 @@ margin-top: $main-nav-height-mobile; - @media #{$breakpoint-dimension-md} { + @media #{$breakpoint-dimension-sm} { margin-top: $main-nav-height; } } diff --git a/src/features/home/components/home-page/home-page.component.tsx b/src/features/home/components/home-page/home-page.component.tsx index ab9f907b..ee47837c 100644 --- a/src/features/home/components/home-page/home-page.component.tsx +++ b/src/features/home/components/home-page/home-page.component.tsx @@ -8,7 +8,6 @@ import { import { AssetsComponent } from "@/features/home/components/assets/assets.component"; import { EbookComponent } from "@/features/common/components/ebook/ebook.component"; import { StructuredData } from "@/features/seo/components/structured-data.component"; -import { HeroModalStateValues } from "@/features/home/values/hero-modal-state.values"; import { ClaimDescriptionVisibilityValues } from "@/features/common/values/claim-description-visibility.values"; import { DebuggerWidgetComponent } from "@/features/debugger/components/debugger-widget/debugger-widget.component"; import { getAuth0Dictionary } from "@/features/localization/services/ui-language-dictionary.service"; @@ -19,8 +18,6 @@ interface HomePageComponentProps { decodedPayloadInitialTabId: string; decodedHeaderDescriptionVisibility: ClaimDescriptionVisibilityValues; decodedPayloadDescriptionVisibility: ClaimDescriptionVisibilityValues; - jwtInfoState: HeroModalStateValues; - jwtWarningState: HeroModalStateValues; // debuggerInitialMode: DebuggerModeValues; } @@ -30,8 +27,6 @@ export const HomePageComponent: React.FC = ({ decodedPayloadInitialTabId, decodedHeaderDescriptionVisibility, decodedPayloadDescriptionVisibility, - jwtInfoState, - jwtWarningState, // debuggerInitialMode, }) => { const homeDictionary = getHomeDictionary(languageCode); @@ -133,15 +128,7 @@ export const HomePageComponent: React.FC = ({ /> Date: Mon, 22 Sep 2025 18:04:09 -0500 Subject: [PATCH 2/9] remove hero.utils.ts file --- src/features/common/services/hero.utils.ts | 14 -------------- 1 file changed, 14 deletions(-) delete mode 100644 src/features/common/services/hero.utils.ts diff --git a/src/features/common/services/hero.utils.ts b/src/features/common/services/hero.utils.ts deleted file mode 100644 index 58c5e09e..00000000 --- a/src/features/common/services/hero.utils.ts +++ /dev/null @@ -1,14 +0,0 @@ -import { HeroModalStateValues } from "@/features/home/values/hero-modal-state.values"; - -export const getSanitizedHeroModalStateValue = ( - value: string | null, -): HeroModalStateValues | null => { - if ( - value === HeroModalStateValues.CLOSED || - value === HeroModalStateValues.OPEN - ) { - return value; - } - - return null; -}; From 6b21eea7d7a7018e9c8a05f1b4e916fcec755b63 Mon Sep 17 00:00:00 2001 From: Christian Samaniego <199278128+christiansamaniego-okta@users.noreply.github.com> Date: Mon, 22 Sep 2025 18:53:23 -0500 Subject: [PATCH 3/9] remove unused props from dictionary --- .../localization/dictionaries/home/en.ts | 16 ---------------- 1 file changed, 16 deletions(-) diff --git a/src/features/localization/dictionaries/home/en.ts b/src/features/localization/dictionaries/home/en.ts index 8e437dbe..076f652a 100644 --- a/src/features/localization/dictionaries/home/en.ts +++ b/src/features/localization/dictionaries/home/en.ts @@ -54,17 +54,8 @@ export const enHomeDictionary: HomeDictionaryModel = { description: null, }, info: { - summary: "What is a JWT?", description: "Decode, verify, and generate JSON Web Tokens, which are an open, industry standard RFC 7519 method for representing claims securely between two parties.", - ctaButton: { - label: "Learn more about JWT", - path: sitePaths.introduction, - }, - secondaryCtaButton: { - label: "See JWT libraries", - path: sitePaths.libraries, - }, resources: { spec: { name: "RFC 7519", @@ -72,13 +63,6 @@ export const enHomeDictionary: HomeDictionaryModel = { }, }, }, - warning: { - summary: "Warning about using JWTs", - title: - "For your protection, all JWT debugging and validation happens in the browser.", - description: - "Be careful where you paste or share JWTs as they can represent credentials that grant access to resources. This site does not store or transmit your JSON Web Tokens outside of the browser.", - }, decoder: { title: "JWT Decoder", compactTitle: "Decoder", From 259629451a2ded79eeac2d23825b953eb14ab3af Mon Sep 17 00:00:00 2001 From: Christian Samaniego <199278128+christiansamaniego-okta@users.noreply.github.com> Date: Tue, 23 Sep 2025 09:03:57 -0500 Subject: [PATCH 4/9] remove unused props from ja dictionary --- .../localization/dictionaries/home/ja.ts | 16 ---------------- 1 file changed, 16 deletions(-) diff --git a/src/features/localization/dictionaries/home/ja.ts b/src/features/localization/dictionaries/home/ja.ts index d75fe505..d905a932 100644 --- a/src/features/localization/dictionaries/home/ja.ts +++ b/src/features/localization/dictionaries/home/ja.ts @@ -54,17 +54,8 @@ export const jaHomeDictionary: HomeDictionaryModel = { description: null, }, info: { - summary: "JWTとは？", description: "JSON Web Tokenをデコード、検証、生成します。JSON Web Tokenは、2つの当事者間でクレームを安全に表現するための、オープンな業界標準（RFC 7519）です。", - ctaButton: { - label: "JWTの詳細情報", - path: sitePaths.introduction, - }, - secondaryCtaButton: { - label: "JWTライブラリを見る", - path: sitePaths.libraries, - }, resources: { spec: { name: "RFC 7519", @@ -72,13 +63,6 @@ export const jaHomeDictionary: HomeDictionaryModel = { }, }, }, - warning: { - summary: "JWTを使用する際の注意事項", - title: - "セキュリティを確保するため、すべてのJWTのデバッグと検証はブラウザ内で行われます。", - description: - "JWTはリソースへのアクセス権を示す認証情報として機能する可能性があるため、貼り付けや共有を行う際には十分注意してください。このサイトでは、JSON Web Tokenをブラウザの外部に保存したり送信したりすることはありません。", - }, decoder: { title: "JWTデコーダー", compactTitle: "デコーダー", From ea25f7793ae7624f9fdd83f3538740304498e511 Mon Sep 17 00:00:00 2001 From: Christian Samaniego <199278128+christiansamaniego-okta@users.noreply.github.com> Date: Tue, 23 Sep 2025 09:40:43 -0500 Subject: [PATCH 5/9] fix playwright alerts --- e2e/decoder.spec.ts | 2 +- e2e/e2e.values.ts | 4 ++-- e2e/encoder.spec.ts | 2 +- 3 files changed, 4 insertions(+), 4 deletions(-) diff --git a/e2e/decoder.spec.ts b/e2e/decoder.spec.ts index 27963f7d..dc6e7231 100644 --- a/e2e/decoder.spec.ts +++ b/e2e/decoder.spec.ts @@ -26,7 +26,7 @@ import { } from "./e2e.utils"; import { MessageStatusValue, MessageTypeValue } from "./e2e.values"; import { JwtDictionaryModel, JwtSignedWithDigitalModel } from "./e2e.models"; -import jwts from "./jwt.json" assert { type: "json" }; +import jwts from "./jwt.json" with { type: "json" }; const TestJwts = (jwts as JwtDictionaryModel).byAlgorithm; diff --git a/e2e/e2e.values.ts b/e2e/e2e.values.ts index c58f4051..389e76ba 100644 --- a/e2e/e2e.values.ts +++ b/e2e/e2e.values.ts @@ -1,10 +1,10 @@ -export enum MessageTypeValue { +export const enum MessageTypeValue { SUCCESS = "success", WARNING = "warning", ERROR = "error", } -export enum MessageStatusValue { +export const enum MessageStatusValue { VISIBLE = "visible", NOT_VISIBLE = "not-visible", } diff --git a/e2e/encoder.spec.ts b/e2e/encoder.spec.ts index 5cf26eec..1bf35f1c 100644 --- a/e2e/encoder.spec.ts +++ b/e2e/encoder.spec.ts @@ -15,7 +15,7 @@ import { getLang, switchToEncoderTab, } from "./e2e.utils"; -import jwts from "./jwt.json" assert { type: "json" }; +import jwts from "./jwt.json" with { type: "json" }; import { JwtDictionaryModel, JwtSignedWithDigitalModel, From 3242917b7f3750c4650dbe72f856da30c39896ae Mon Sep 17 00:00:00 2001 From: Christian Samaniego <199278128+christiansamaniego-okta@users.noreply.github.com> Date: Tue, 23 Sep 2025 10:42:07 -0500 Subject: [PATCH 6/9] disable no-experimental-strip-types --- .github/workflows/tests.yaml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/tests.yaml b/.github/workflows/tests.yaml index 7627c212..34a9871c 100644 --- a/.github/workflows/tests.yaml +++ b/.github/workflows/tests.yaml @@ -27,7 +27,7 @@ jobs: run: npx playwright install --with-deps - name: Run Playwright Tests - run: npx playwright test + run: NODE_OPTIONS="--no-experimental-strip-types" npx playwright test - name: Upload Playwright Traces if: failure() From da241b95107b6f570f3ac2b05f04614a8e10321c Mon Sep 17 00:00:00 2001 From: Christian Samaniego <199278128+christiansamaniego-okta@users.noreply.github.com> Date: Tue, 23 Sep 2025 10:57:06 -0500 Subject: [PATCH 7/9] Revert "disable no-experimental-strip-types" This reverts commit 3242917b7f3750c4650dbe72f856da30c39896ae. --- .github/workflows/tests.yaml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/tests.yaml b/.github/workflows/tests.yaml index 34a9871c..7627c212 100644 --- a/.github/workflows/tests.yaml +++ b/.github/workflows/tests.yaml @@ -27,7 +27,7 @@ jobs: run: npx playwright install --with-deps - name: Run Playwright Tests - run: NODE_OPTIONS="--no-experimental-strip-types" npx playwright test + run: npx playwright test - name: Upload Playwright Traces if: failure() From 06dd78adf99fc4576b131cd2eb1f62021d64b069 Mon Sep 17 00:00:00 2001 From: Christian Samaniego <199278128+christiansamaniego-okta@users.noreply.github.com> Date: Tue, 23 Sep 2025 10:57:20 -0500 Subject: [PATCH 8/9] Revert "fix playwright alerts" This reverts commit ea25f7793ae7624f9fdd83f3538740304498e511. --- e2e/decoder.spec.ts | 2 +- e2e/e2e.values.ts | 4 ++-- e2e/encoder.spec.ts | 2 +- 3 files changed, 4 insertions(+), 4 deletions(-) diff --git a/e2e/decoder.spec.ts b/e2e/decoder.spec.ts index dc6e7231..27963f7d 100644 --- a/e2e/decoder.spec.ts +++ b/e2e/decoder.spec.ts @@ -26,7 +26,7 @@ import { } from "./e2e.utils"; import { MessageStatusValue, MessageTypeValue } from "./e2e.values"; import { JwtDictionaryModel, JwtSignedWithDigitalModel } from "./e2e.models"; -import jwts from "./jwt.json" with { type: "json" }; +import jwts from "./jwt.json" assert { type: "json" }; const TestJwts = (jwts as JwtDictionaryModel).byAlgorithm; diff --git a/e2e/e2e.values.ts b/e2e/e2e.values.ts index 389e76ba..c58f4051 100644 --- a/e2e/e2e.values.ts +++ b/e2e/e2e.values.ts @@ -1,10 +1,10 @@ -export const enum MessageTypeValue { +export enum MessageTypeValue { SUCCESS = "success", WARNING = "warning", ERROR = "error", } -export const enum MessageStatusValue { +export enum MessageStatusValue { VISIBLE = "visible", NOT_VISIBLE = "not-visible", } diff --git a/e2e/encoder.spec.ts b/e2e/encoder.spec.ts index 1bf35f1c..5cf26eec 100644 --- a/e2e/encoder.spec.ts +++ b/e2e/encoder.spec.ts @@ -15,7 +15,7 @@ import { getLang, switchToEncoderTab, } from "./e2e.utils"; -import jwts from "./jwt.json" with { type: "json" }; +import jwts from "./jwt.json" assert { type: "json" }; import { JwtDictionaryModel, JwtSignedWithDigitalModel, From 43960f2084206b4297e387c18b1e67123be4889b Mon Sep 17 00:00:00 2001 From: Christian Samaniego <199278128+christiansamaniego-okta@users.noreply.github.com> Date: Tue, 23 Sep 2025 11:58:26 -0500 Subject: [PATCH 9/9] update color_fg_default variable --- src/libs/theme/styles/globals.scss | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/libs/theme/styles/globals.scss b/src/libs/theme/styles/globals.scss index 7c779af1..3b5bae45 100644 --- a/src/libs/theme/styles/globals.scss +++ b/src/libs/theme/styles/globals.scss @@ -45,7 +45,7 @@ :root { --color_bg_page: var(--functional-gray-950); --color_fg_bold: var(--functional-gray-50); - --color_fg_default: var(--functional-gray-500); + --color_fg_default: var(--functional-gray-200); --color_fg_link_primary: var(--cloud); --color_bg_app_bar: hsla(0,0%,7%,.04); @@ -229,6 +229,7 @@ html[data-theme="system-light"] { --color_bg_disabled: var(--functional-gray-150); --color_fg_disabled: var(--functional-gray-500); + --color_fg_default: var(--functional-gray-500); --color_bg_input: var(--functional-gray-0); --color_fg_input_placeholder: var(--functional-gray-500);