Setup new /templates route to retrieve templates for all organizations for a user
Create new template gallery page calledMultiOrgTemplatesPageView using a grid layout
Create Storybook component forMultiOrgTemplatesPageView
Filter templates by organization-id
Render multi-org template gallery page if multi-organization experiment is enabled
Create component for TemplateCard in template gallery grid
Create storybook component forTemplateCard
Display organization count to the right of each organization in the organization labels list
Highlight template card on mouseover, onClick should link to template page
Hide organization filter if the user has templates for only 1 organization

jaaydenh added the feature label

Jul 3, 2024

jaaydenh self-assigned this

Jul 3, 2024

jaaydenh changed the title~~Multi org template gallery~~feat: multi-org template gallery

Jul 3, 2024

jaaydenh changed the title~~feat: multi-org template gallery~~feat: implement multi-org template gallery

Jul 3, 2024

jaaydenh force-pushed themulti-org-template-gallery branch 3 times, most recently fromfa872e0 to63827efCompare

July 11, 2024 02:29

jaaydenh requested a review fromaslilac

July 11, 2024 15:20

jaaydenh marked this pull request as ready for review

July 11, 2024 15:20

jaaydenh requested a review fromBrunoQuaresma

July 12, 2024 14:35

BrunoQuaresma reviewed

Jul 12, 2024

View reviewed changes

site/src/api/queries/templates.ts OutdatedShow resolvedHide resolved

BrunoQuaresma reviewed

Jul 12, 2024

View reviewed changes

site/src/api/typesGenerated.tsShow resolvedHide resolved

Copy link

Contributor

BrunoQuaresma commentedJul 12, 2024

I have a few design considerations. I believe we can avoid adding more components and create another view solely for filtering based on organizations. We could achieve this using pills as filters or by replicating what we have for workspaces.

Pills:

Replicating Workspaces:

jaaydenh force-pushed themulti-org-template-gallery branch 2 times, most recently from89e54a4 tobd2bb03Compare

July 15, 2024 16:35

aslilac reviewed

Jul 15, 2024

View reviewed changes

Copy link

Member

aslilac left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

sorry for taking so long to review! 💀

codersdk/organizations.go OutdatedShow resolvedHide resolved

site/src/api/queries/templates.ts OutdatedShow resolvedHide resolved

site/src/modules/templates/TemplateCard/TemplateCard.tsx


		exportconstTemplateCard:FC<TemplateCardProps>=({
		template,
		...divProps

Copy link

Member

aslilacJul 15, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

super minor nit, I tend to call these sorts of capturesattrs, but there's definitely precedent for calling itwhateverProps too. maybe this is something we should consolidate on...

Copy link

ContributorAuthor

jaaydenhJul 16, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

I was following the pattern in the files I was working on. In other code bases/the React docs, this is often called ...props as well. I think it depends if we want to call them based on what they are, "props" or how they are used, props on divs "divProps" or attributes on divs "attrs"

site/src/utils/templateAggregators.tsShow resolvedHide resolved

site/src/utils/templateAggregators.ts OutdatedShow resolvedHide resolved

Copy link

ContributorAuthor

jaaydenh commentedJul 17, 2024

I have a few design considerations. I believe we can avoid adding more components and create another view solely for filtering based on organizations. We could achieve this using pills as filters or by replicating what we have for workspaces.

@aslilac Can you comment on the feedback from@BrunoQuaresma as you have more context around the design decisions?

jaaydenh requested a review fromaslilac

July 17, 2024 02:04

jaaydenh added12 commits

July 17, 2024 14:37

feat: initial changes for multi-org templates page

0a5c431

feat: add TemplateCard component

6f96fee

feat: add component stories

51ebb67

chore: update template query naming

a0effc6

fix: fix formatting

be37085

feat: template card interaction and navigation

5649166

fix: copy updates

3ea3aa2

chore: update TemplateFilter type to include FilterQuery

f17a0c3

chore: update typesGenerated.ts

0077db0

feat: update template filter api logic

461202e

fix: fix format

66e02fb

fix: get activeOrg

369c59f

jaaydenh added13 commits

July 17, 2024 14:37

fix: add format annotation

c41cdc4

chore: use organization display name

7f5d35e

feat: client side org filtering

6e2a6d8

fix: use org display name

978c047

fix: add ExactName

aaed038

feat: show orgs filter only if more than 1 org

8d84ad9

chore: updates for PR review

a1c6169

fix: fix format

15542c0

chore: add story for multi org

8f4c56f

fix: aggregate templates by organization id

a282bac

fix: fix format

b092644

fix: check org count

32376e6

fix: update ExactName type

801138a

jaaydenh force-pushed themulti-org-template-gallery branch fromfc2e6f9 to801138aCompare

July 17, 2024 14:51

Copy link

Member

aslilac commentedJul 18, 2024

@BrunoQuaresma the design is based off of the starter template gallery, and aims to bring some distinction between the appearance of workspace related pages and the appearance of the template related pages. investigating the pills idea sounds interesting, but we can mess with the design more after the experiment has shipped.