User attribute component by zachharrison · Pull Request #494 · saasquatch/program-tools

Zach Harrison (zachharrison) · 2026-05-04T19:16:25Z

Description of the change

Added new component to allow users to display the value of custom fields in widgets and microsites

Type of change

Bug fix (non-breaking change that fixes an issue)
New feature (non-breaking change that adds functionality)
Breaking change (fix or feature that would cause existing functionality to not work as expected)
Documentation or Development tools (readme, specs, tests, code formatting)

Links

Jira issue number: (PUT IT HERE)
Process.st launch checklist: (PUT IT HERE)

Checklists

Development

Prettier was run (if applicable)
The behaviour changes in the pull request are covered by specs
All tests related to the changed code pass in development

Paperwork

This pull request has a descriptive title and information useful to a reviewer
This pull request has a Jira number
This pull request has a Process.st launch checklist

Code review

Changes have been reviewed by at least one other engineer
Security impacts of this change have been considered

Copilot

Pull request overview

Adds a new Mint Stencil component (<sqm-user-attribute>) intended to display a logged-in user’s custom field value by querying viewer.customFields, and exposes it in Stencilbook for demo/testing.

Changes:

Introduces sqm-user-attribute component, hook, and view for rendering a selected user custom field.
Adds a Stencilbook story and wires it into sqm-stencilbook.
Updates generated docs/types (components.d.ts, component readme) and bumps @saasquatch/mint-components version.

Reviewed changes

Copilot reviewed 9 out of 10 changed files in this pull request and generated 8 comments.

Show a summary per file

File	Description
packages/mint-components/src/components/sqm-user-attribute/useUserAttribute.ts	Adds GraphQL hook to fetch `viewer.customFields` and derive the displayed attribute value.
packages/mint-components/src/components/sqm-user-attribute/sqm-user-attribute.tsx	Adds the new Stencil component wrapper and demo-mode hook wiring.
packages/mint-components/src/components/sqm-user-attribute/sqm-user-attribute-view.tsx	Adds the presentational view for rendering loading text or the attribute value.
packages/mint-components/src/components/sqm-user-attribute/UserAttribute.stories.tsx	Adds a basic Stencilbook story for the new component.
packages/mint-components/src/components/sqm-user-attribute/user-attribute.feature	Adds a (currently placeholder) cucumber/gherkin spec file.
packages/mint-components/src/components/sqm-user-attribute/readme.md	Adds autogenerated component docs for the new component.
packages/mint-components/src/components/sqm-stencilbook/sqm-stencilbook.tsx	Registers the new story module in the Stencilbook story list.
packages/mint-components/src/components/sqm-stencilbook/readme.md	Updates Stencilbook docs graph to include the new component dependency.
packages/mint-components/src/components.d.ts	Updates generated component typings to include `sqm-user-attribute`.
packages/mint-components/package.json	Bumps the package version.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Copilot

Pull request overview

Copilot reviewed 9 out of 10 changed files in this pull request and generated 6 comments.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Copilot

Pull request overview

Copilot reviewed 10 out of 11 changed files in this pull request and generated 8 comments.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Copilot

Pull request overview

Copilot reviewed 10 out of 11 changed files in this pull request and generated 4 comments.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>

Copilot

Pull request overview

Copilot reviewed 10 out of 11 changed files in this pull request and generated 7 comments.

Comments suppressed due to low confidence (2)

packages/mint-components/src/components/sqm-user-attribute/sqm-user-attribute-view.tsx:34

The render guard props.value && (...) will treat valid custom field values like 0 as falsy and render nothing. Since customFields are used as numeric counters elsewhere in the codebase, consider checking for null/undefined instead of truthiness so 0 still displays.

    props.value && (
      <Host>
        <style>{styleString}</style>
        <p class={sheet.classes.P} part="sqm-base">
          {props.loading ? loadingSkeleton : props.value}
        </p>
      </Host>
    )

packages/mint-components/src/components/sqm-user-attribute/user-attribute.feature:45

The spec claims style props are optional and default to "default browser styles", but the view always applies base styles (e.g., margin: 0, padding: 0, and a default color). Update the scenario text to reflect the actual baseline styling, or adjust the implementation to truly leave browser defaults unchanged when no style props are set.

  @minutia
  Scenario: Style props are optional and default to no custom styling
    Given the component has no style props set
    When the component is rendered
    Then the text is displayed with default browser styles

Copilot

Pull request overview

Copilot reviewed 11 out of 13 changed files in this pull request and generated 8 comments.

Files not reviewed (1)

packages/mint-components/package-lock.json: Language not supported

+export interface UserAttributeViewProps {
+  loading: boolean;
+  value: string;
+  fontSize?: number;
+  color?: string;
+  fontWeight?: number;
+}


This commit was generated by GitHub Actions CI

Copilot

Pull request overview

Copilot reviewed 11 out of 13 changed files in this pull request and generated 8 comments.

Files not reviewed (1)

packages/mint-components/package-lock.json: Language not supported

Copilot

Pull request overview

Copilot reviewed 11 out of 13 changed files in this pull request and generated 6 comments.

Files not reviewed (1)

packages/mint-components/package-lock.json: Language not supported

Comments suppressed due to low confidence (1)

packages/mint-components/.changeset/soft-dryers-invite.md:6

Typo/grammar in the changeset summary: "a users custom fields" should be "a user's custom fields".


Add new user-attribute component used to display a users custom fields in widgets and microsites

This commit was generated by GitHub Actions CI

Copilot

Pull request overview

Copilot reviewed 12 out of 15 changed files in this pull request and generated 6 comments.

Files not reviewed (2)

packages/express-boilerplate/package-lock.json: Language not supported
packages/mint-components/package-lock.json: Language not supported

This commit was generated by GitHub Actions CI

Copilot

Pull request overview

Copilot reviewed 12 out of 15 changed files in this pull request and generated 8 comments.

Files not reviewed (2)

packages/express-boilerplate/package-lock.json: Language not supported
packages/mint-components/package-lock.json: Language not supported

@@ -0,0 +1,39 @@
+# sqm-sidebar-item


AndiLuo · 2026-05-26T01:57:05Z

  "name": "@saasquatch/mint-components",
  "title": "Mint Components",
-  "version": "2.1.13",
+  "version": "2.1.14-1",


 {
  "name": "@saasquatch/mint-components",
-  "version": "2.1.13",
+  "version": "2.1.14-1",
  "lockfileVersion": 2,
  "requires": true,
  "packages": {
    "": {
      "name": "@saasquatch/mint-components",
-      "version": "2.1.13",
+      "version": "2.1.14-1",
      "hasInstallScript": true,
      "license": "MIT",
      "dependencies": {


+"@saasquatch/mint-components": minor
+---
+
+Add new user-attribute component used to display a users custom fields in widgets and microsites


 {
  "name": "@saasquatch/express-boilerplate",
-  "version": "1.1.2-0",
+  "version": "1.1.2-1",
  "description": "Boilerplate middleware and functions for building Express apps on Kubernetes",
  "main": "dist/index.js",
  "private": false,


 {
  "name": "@saasquatch/express-boilerplate",
-  "version": "1.1.2-0",
+  "version": "1.1.2-1",
  "lockfileVersion": 3,
  "requires": true,
  "packages": {
    "": {
      "name": "@saasquatch/express-boilerplate",
-      "version": "1.1.2-0",
+      "version": "1.1.2-1",
      "license": "MIT",
      "dependencies": {
        "nanoid": "^3.3.7"


+  const loading = res.loading;
+  const customFields = res.data?.viewer?.customFields;
+  let value = customFields?.[props.value];
+
+  if (props.value === "lastSeenDate" && typeof value === "number") {
+    value = DateTime.fromMillis(value).toLocaleString(DateTime.DATE_MED);
+  }


+import { createStyleSheet } from "../../styling/JSS";
+export interface UserAttributeViewProps {
+  loading: boolean;
+  value: string;


Zach Harrison (zachharrison) added 3 commits April 28, 2026 16:05

Add component for user attribute

9795cab

Update uiWidget and fix CSS part

a899130

Version bump

4bf1c1c

Copilot AI review requested due to automatic review settings May 4, 2026 19:16

Copilot started reviewing on behalf of Zach Harrison (zachharrison) May 4, 2026 19:17 View session

Copilot AI reviewed May 4, 2026

View reviewed changes

Zach Harrison (zachharrison) added 2 commits May 4, 2026 14:05

Add styling options

b4a2632

Update specs, stories, and styling options

05d6c6c

Copilot AI review requested due to automatic review settings May 4, 2026 22:32

Copilot started reviewing on behalf of Zach Harrison (zachharrison) May 4, 2026 22:32 View session

Copilot AI reviewed May 4, 2026

View reviewed changes

Zach Harrison (zachharrison) added 2 commits May 4, 2026 16:39

Update styling and jsDocs

251c6c2

Update styling and version

dbc1651

Copilot AI review requested due to automatic review settings May 5, 2026 15:27

Copilot started reviewing on behalf of Zach Harrison (zachharrison) May 5, 2026 15:27 View session

Copilot AI reviewed May 5, 2026

View reviewed changes

Zach Harrison (zachharrison) added 2 commits May 5, 2026 10:38

Fix demoData and CSS

ec53af6

Cleanup specs

41c5f29

Copilot AI review requested due to automatic review settings May 5, 2026 17:41

Copilot started reviewing on behalf of Zach Harrison (zachharrison) May 5, 2026 17:42 View session

Copilot AI reviewed May 5, 2026

View reviewed changes

Zach Harrison (zachharrison) and others added 2 commits May 19, 2026 11:34

Merge branch 'master' into user-attribute-component

7edeb36

Potential fix for pull request finding

9a27b77

Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>

Copilot AI review requested due to automatic review settings May 19, 2026 23:09

Copilot started reviewing on behalf of Zach Harrison (zachharrison) May 19, 2026 23:10 View session

Remove loading text from example tag

83c8384

Copilot AI reviewed May 19, 2026

View reviewed changes

Zach Harrison (zachharrison) added 2 commits May 19, 2026 16:21

Version bump

06dc458

Merge branch 'master' into user-attribute-component

b741768

Copilot AI review requested due to automatic review settings May 20, 2026 17:27

Merge branch 'master' into user-attribute-component

92bc5d2

AndiLuo approved these changes May 20, 2026

View reviewed changes

AndiLuo self-requested a review May 20, 2026 23:39

AndiLuo reviewed May 20, 2026

View reviewed changes

Comment thread packages/mint-components/src/components/sqm-user-attribute/sqm-user-attribute.tsx Outdated

AndiLuo requested changes May 20, 2026

View reviewed changes

Fix default component props and add case to format lastSeenDate

9cbaae8

Copilot AI review requested due to automatic review settings May 25, 2026 18:21

Copilot started reviewing on behalf of Zach Harrison (zachharrison) May 25, 2026 18:21 View session

Copilot AI reviewed May 25, 2026

View reviewed changes

Zach Harrison (zachharrison) and others added 2 commits May 25, 2026 11:47

Add fail condition

64b1f6c

publish: @saasquatch/mint-components v2.1.10-60

c6ea4ac

This commit was generated by GitHub Actions CI

Copilot AI review requested due to automatic review settings May 25, 2026 18:49

Copilot started reviewing on behalf of Zach Harrison (zachharrison) May 25, 2026 18:50 View session

Copilot AI reviewed May 25, 2026

View reviewed changes

Zach Harrison (zachharrison) added 2 commits May 25, 2026 14:59

Fix empty space bug when no valid value is passed

6f98114

Version bump

597396c

Copilot AI review requested due to automatic review settings May 25, 2026 23:04

Copilot started reviewing on behalf of Zach Harrison (zachharrison) May 25, 2026 23:04 View session

Copilot AI reviewed May 25, 2026

View reviewed changes

Zach Harrison (zachharrison) and others added 2 commits May 25, 2026 16:09

update pre release number

c1f55ca

publish: @saasquatch/express-boilerplate v1.1.2-1

f3ed6a8

This commit was generated by GitHub Actions CI

Copilot AI review requested due to automatic review settings May 25, 2026 23:19

Copilot started reviewing on behalf of Zach Harrison (zachharrison) May 25, 2026 23:19 View session

Copilot AI reviewed May 25, 2026

View reviewed changes

github-actions Bot and others added 2 commits May 25, 2026 23:39

publish: @saasquatch/mint-components v2.1.14-1

03a4894

This commit was generated by GitHub Actions CI

Merge branch 'master' into user-attribute-component

2260410

Copilot AI review requested due to automatic review settings May 26, 2026 00:10

Copilot started reviewing on behalf of Zach Harrison (zachharrison) May 26, 2026 00:10 View session

Zach Harrison (zachharrison) requested a review from AndiLuo May 26, 2026 00:10

Copilot AI reviewed May 26, 2026

View reviewed changes

Conversation

Zach Harrison (zachharrison) commented May 4, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description of the change

Type of change

Links

Checklists

Development

Paperwork

Code review

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Zach Harrison (zachharrison) commented May 4, 2026 •

edited

Loading