2023-05-03 Paragon Meeting notes

5-10 minutes

Social Media Icons

@Gabriel Weinberg

• Material Icons does not have social media icons

• Found a Figma library that has been modeled from material UI

• Needs separate implementation to be made available in the library

• Is this the best solution for social media icons for now?

• Figma Paragon filehttps://www.figma.com/file/eGmDp94FlqEr4iSqy1Uc1K/Paragon-Design-System?node-id=48359%3A84114&t=Kjgvg8ub1gx9KJl1-1

• Is there an NPM package?

  • Concerns: are they 24x24px and/or can they transformed to be 24x24px.

  • Potential options:

    • https://www.npmjs.com/package/react-social-media-icons/v/10.0.0

    • Bootstrap icons? https://icons.getbootstrap.com/

• Let's make sure we have a way to stay up to date. There’s a lot of examples of sites using old icons from social brands.

• We do have reddit and facebook and some kind of youtube search icon already

• Is the brand color important for the social media icons, or black only and being recolored based on theme?

5 minutes

Playground Beta release

@Viktor Rusakov

We release Beta version of the playground, check it out here! Leave any feedback in the Paragon slack channel thread or create a github issue through this link

Paragon Lunch n' learn

@Gabriel Weinberg

• What is it?

• How to use it?

• We were asked by at least one engineering team at 2U that asked for this; might be a broader opportunity for other teams too.

• We could use this Lunch n' Learn to find Subject Matter Experts (SMEs) with Paragon.

• [Kaleb] Is the L&L more engineering specific or relevant for designers/product, too?

  • Should be relevant for anyone. Builds empathy for non-technical folks on what goes into working with Paragon.

•  

SMEs for Paragon on product teams

@Kaleb Davenport

• Embedded SME (eSME) Training for work that only an eSME can do.

  • concern: only that person will get stuck with Paragon related things.

• Is there a way to communicate this differently?

  • E.g., Paragon Evangelists, Paragon Advocate, etc.

• Challenge working with Paragon is often timeline specific, not person specific.

  • How does a Paragon issue/contribution fit into a product team’s delivery?

    • Been a longstanding challenge.

    • PM should understand the tradeoffs to not contribute to Paragon (e.g., maintaining a custom build component vs. using something that will be maintained/updated upstream).

    • Forking and develop in the fork.

  • [Hamzah] Is there a backlog for the Paragon SRE / ceremonies like cross-team standups, etc.?

    • Feels like this may be too heavy of a process. We should strive for a lightweight process.

    • How do we catch code implementations that could be implemented simply

    • [question] Is there a better way to onboard to Paragon rather than scouring over the docs site?

  • [Anastasiia] Is there a stakeholder matrix for Paragon?

    • Best ways to pass information between people.

      • How do we communicate updates, etc.?

    • Do we really need an SME or not?

  • Gabe is currently working on a deck for a Paragon Lunch & Learn for a specific team.

    • Opportunity to open up to more teams.

    • Plans to bring it to future PWG for feedback/review.

    • [Kaleb] also bring to solution review and something more formalized for the SME advocate idea/process.

5 minutes

NPM workspaces in Paragon

@Viktor Rusakov

@Adam Stankiewicz

Paragon git repository contains several smaller packages which was sometimes a pain point for the engineers as they would need to perform same action for each of the separate package (e.g. install dependencies).

We improved that by introducing npm workspaces in the repository (basically creating a monorepo) which allows us to greatly simplify local development in Paragon.

Example improvements

Installing dependencies

As a newcomer to Paragon who wants to install the NPM dependencies, previously you’d either have to run npm install in each individual package or have knowledge of a npm run install-all NPM script we were maintaining.

Now, running npm install after cloning the repo will install NPM dependencies for all packages.

All packages are added to a single, top-level node_modules instead of each package getting its own node_modules.

Starting the docs site locally

Previously, running npm start would output a command to cd www && npm start.

With NPM workspaces, npm start runs the npm start command in the www package.