From 0534b1b962637b28b2022965d1e92ed3f50da9a5 Mon Sep 17 00:00:00 2001 From: jmgasper Date: Fri, 2 Oct 2026 08:48:30 +1000 Subject: [PATCH 1/2] Add host-scoped Topgear community navigation --- README.md | 19 ++++- iac/uni-nav.deploy.yml | 3 + package.json | 2 + src/README.md | 6 ++ src/lib/components/user-area/UserArea.svelte | 5 +- src/lib/nudge-app/components/Animation.svelte | 6 +- .../TopgearNavigation.module.scss | 75 ++++++++++++++++++ .../TopgearNavigation.svelte | 34 ++++++++ .../topgear-navigation/assets/topcoder.svg | 29 +++++++ src/lib/topgear-navigation/assets/topgear.png | Bin 0 -> 2387 bytes src/lib/topgear-navigation/assets/wipro.png | Bin 0 -> 6444 bytes src/lib/utils/navigation-type.ts | 14 ++++ src/main.ts | 6 +- tests/navigation-type.test.mjs | 21 +++++ types/src/lib/utils/navigation-type.d.ts | 10 +++ types/src/main.d.ts | 2 +- 16 files changed, 224 insertions(+), 8 deletions(-) create mode 100644 src/lib/topgear-navigation/TopgearNavigation.module.scss create mode 100644 src/lib/topgear-navigation/TopgearNavigation.svelte create mode 100644 src/lib/topgear-navigation/assets/topcoder.svg create mode 100644 src/lib/topgear-navigation/assets/topgear.png create mode 100644 src/lib/topgear-navigation/assets/wipro.png create mode 100644 src/lib/utils/navigation-type.ts create mode 100644 tests/navigation-type.test.mjs create mode 100644 types/src/lib/utils/navigation-type.d.ts diff --git a/README.md b/README.md index b73242e0..ae39ae5e 100644 --- a/README.md +++ b/README.md @@ -41,7 +41,7 @@ The following properties use the UniNav for the MVP: ### Navigation Types -The UniNav comprises 3 parts, `'marketing' | 'tool' | 'footer'`, which are described here. +The UniNav comprises 4 variants, `'marketing' | 'tool' | 'topgear' | 'footer'`, which are described here. #### Marketing Navigation @@ -55,6 +55,21 @@ This navigation is rendered for all non-marketing web properites (e.g https://pl The navigation configuration is supplied upon initialization by the tool itself. See [2. Initialize tcUnNav](#2-initialize-tcuninav) for more info. +#### Topgear Navigation + +Tool navigation automatically uses the Topgear header on exactly +`topgear.topcoder.com` and `topgear.topcoder-dev.com`. Integrations can also +request `type: 'topgear'`; it falls back to the tool header on any other host. +Marketing and footer navigation are unaffected. + +The responsive header reuses community-app's Wipro, Topcoder, and Topgear logos. +Home links to `https://topgear-app.wipro.com`; Challenges links to +`/opportunities/challenge` on the current Topgear origin. It retains account +controls, without the tool selector, Leaderboard, or the community hero banner. +Deploy the navigation bundle before the Platform UI migration. Its CloudFront +CORS policy must allow the matching Topgear origin (included in the IAC template). +This change does not redirect production community-app URLs. + #### Footer Navigation This navigation is rendered for all web properties, regardless if they're marketing sites or tools. @@ -292,7 +307,7 @@ Information regarding the changes will be disseminated to the owners of all prop | config.toolName | string | yes (tool nav only) | The name of the tool as it should appear in the header | none | | config.toolRoot | string | yes (tool nav only) | The route to the tool as it should appear in the header | none | | config.fullFooter | boolean | no | Shows the full footer navigation when it is true | false | -| config.type | Enum: 'marketing' \| 'tool' \| 'footer' | yes | The type of navigation to render | | +| config.type | Enum: 'marketing' \| 'tool' \| 'topgear' \| 'footer' | yes | The type of navigation to render | | | config.user | 'auto' | no | Instruct the uni-nav to auto-fetch user profile info based on the `tcjwt` cookie value | {} | | config.user | {photoURL, userId, initials, handle} | no | The logged in user | {} | | config.supportMeta | {challengeId, isSelfService} | no | Additional meta data to be sent along with any support ticket created by the user | | diff --git a/iac/uni-nav.deploy.yml b/iac/uni-nav.deploy.yml index 30fc34dc..955ca730 100644 --- a/iac/uni-nav.deploy.yml +++ b/iac/uni-nav.deploy.yml @@ -161,6 +161,9 @@ Resources: # Platform UI Prod & Dev - !Sub https://platform-ui.${Domain} + # Topgear community on Platform UI + - !Sub https://topgear.${Domain} + # Platform UI sub apps for Prod & Dev - !Sub https://academy.${Domain} - !Sub https://work.${Domain} diff --git a/package.json b/package.json index 3779817d..a89463e9 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,8 @@ "build:nudge": "APP_BUILD_TARGET=nudge vite build --mode=production", "build:base": "vite build --mode=production && npx rimraf ./types && npm run types", "build": "npm run build:base && npm run build:nudge", + "lint": "npm run check", + "test": "node --experimental-strip-types --test tests/*.test.mjs", "check": "svelte-check --tsconfig ./tsconfig.json", "demo:dist": "npx http-server --cors --host local.topcoder-dev.com --port 8083 ./dist", "demo:marketing": "npx http-server --host local.topcoder-dev.com --port 8081 ./demo/marketing -P http://local.topcoder-dev.com:8081? -o /", diff --git a/src/README.md b/src/README.md index e8c78c37..b8a30e3e 100644 --- a/src/README.md +++ b/src/README.md @@ -105,3 +105,9 @@ Both the types commit and the version patch commit will be authored by the user For non-master branches, there is a build job in the CI that will check to see if there are any updates to the types required and exit with an error code 1 with message `WARNING: Types need updating`. The error will not prevent merging a PR or deploying to an environment but will just be a flag for the PR owner and reviewers. + +## Validation + +Run `npm run lint` (Svelte/TypeScript diagnostics), `npm test` (hostname +selection regressions), and `npm run build` before proposing a change. +Tests use the Node version in `.nvmrc` and its TypeScript stripping support. diff --git a/src/lib/components/user-area/UserArea.svelte b/src/lib/components/user-area/UserArea.svelte index e0cbd830..17174a1d 100644 --- a/src/lib/components/user-area/UserArea.svelte +++ b/src/lib/components/user-area/UserArea.svelte @@ -15,6 +15,9 @@ import Completedness from './Completedness.svelte'; import Button from '../Button.svelte'; + /** Whether to offer the cross-application tool selector; hidden in community headers. */ + export let showToolSelector = true; + const ctx = getAppContext(); // debounce updates to user if user.handle stays the same @@ -98,7 +101,7 @@