Giter Club home page Giter Club logo

explore.opensauced.pizza's Introduction

This repo is archived. If you are looking for the latest, check out open-sauced/insights or open-sauced/hot.


Open Sauced

๐Ÿ• Open Sauced ๐Ÿ•

The path to your next Open Source contribution

CodeQL Compliance Release Publish stories if changed Netlify Status Dependabot Badge GitHub code size in bytes GitHub commit activity GitHub issues GitHub Release Discord Twitter

Open Sauced provides structured onboarding for new contributors to open source. This structure provides a way to track your next contributions by leveraging a unique dashboard built on top of the GitHub GraphQL API.

open-sauced-screencap

๐Ÿ“– Prerequisites

In order to run the project from a container we need node>=14, npm>=7 and docker>=20 installed on our development machines or use one of the listed cloud providers we support:

Gitpod

โœ… fully ready integrated development environment

โญ• VS Code settings sync is not ideal

Open in Gitpod

Gitpod is mostly free but has extensive documentation for all its contributing features.

For Vite to work with Gitpod we need to use a custom Dockerfile that lives under .gitpod.Dockerfile.

Open Sauced comes with a pre-defined .gitpod.yml that should work out of the box in multiple contribution scenarios.

Replit

โœ… fully ready integrated development environment

โญ• modified contribution workflows

Open in Replit

Replit is an old service that recently supported NixOS, enabling full customisation of the runner and project.

Open Sauced is configured with a shell environment supporting node@16 and npm@8. The build environment script lives in shell.nix and the repl config lives in .replit.

Codesandbox

โœ… can be used as editor replacement

โœ… supports deployment preview

โญ• enforces custom package manager for stability

โญ• low resources free tier limitations

Open in CodeSandbox

Stackblitz

โœ… can be used as editor replacement

โœ… supports deployment preview

โญ• enforces custom package manager for stability

โญ• limited documentation on container limitations

Open in Stackblitz

Glitch

โœ… can be used as editor replacement

โœ… supports deployment preview

โญ• enforces custom package manager for stability

โญ• does not support stacked hot module reload

โญ• severely low resources free tier limitations

Remix on Glitch

๐Ÿ–ฅ๏ธ Local development

To install the application:

npm ci

To start a local copy of the app on port 3000:

npm start

๐Ÿงช Test

For running the test suite, use the following command. Since the tests run in watch mode by default, some users may encounter errors about too many files being open. In this case, it may be beneficial to install watchman.

npm test

You can request a coverage report by running the following command:

npm run test:coverage

๐Ÿ“ฆ Docker builds

A development preview can also be run from docker:

docker build -t open-sauced-dev .
docker run -p 8080:80 open-sauced-dev

Alternatively you can pull the production container and skip all builds:

docker run -dit -p 8080:80 ghcr.io/open-sauced/open-sauced

๐ŸŽจ Code linting

To check the code and styles quality, use the following command:

npm run lint

This will also display during development, but not break on errors.

To fix the linting errors, use the following command:

npm run format

๐Ÿš€ Production deployment

A production deployment is a complete build of the project, including the build of the static assets.

npm run build

You can analyze the build by running the following command:

npm run build:analyze

๐ŸŽญ Offline asset optimization

We also have a script for updating .svg files used in the project, you only need to run this if you add new assets:

npm run build:svgo

And one for .png and .jpg files:

npm run build:squoosh

๐Ÿšง Development debugging

Thanks to antfu/vite-plugin-inspect we can always inspect the bundles in development by navigating to localhost:3000/__inspect/ in your browser.

๐Ÿ“™ Storybook

Storybook is being leveraged to mock out visual React components. The latest version of the design system can be found at this URL.

npm run storybook

storybook example screenshot

๐Ÿ”‘ Authentication

Authentication is handled through OneGraph's AuthGuardian service.

๐Ÿ’พ Database

This project uses GitHub as a database. When you login, you will be presented with a button to create a goals repository. That repository template lives at open-sauced/goals-template.

๐Ÿ’จ Service Worker

This project uses the sw-precache to kickstart an offline cache. The offline cache only registers in production. If service needs to be manually removed make an unregister call from the registerServiceWorker.js import.

๐ŸŒ™ Dark Mode

This project supports "dark mode" styling, and by default it will follow the color preference on your device. It also allows for overriding this using buttons at the top right of the screen, which will persist the preference to local storage on your device. More info about color preference web API's can be found here: MDN Web Docs

๐Ÿ“ Markdown Support

This project leverages Remirror for a delightful experience in documenting your Open Source goals. The editor supports markdown features including heading levels, bulleted lists, text formatting, code snippets, and emojis!

๐Ÿค Contributing

We encourage you to contribute to Open Sauced! Please check out the Contributing guide for guidelines about how to proceed.

We have a commit utility called @open-sauced/conventional-commit that helps you write your commits in a way that is easy to understand and process by others.

It is generally integrated as an npm script but you can run it with npx as well:

npm run push

For any other npm based project or dotnpmrc defaulting to --yes:

npx -y @open-sauced/conventional-commit

๐Ÿ• Community

Got Questions? Join the conversation in our Discord.
Find Open Sauced videos and release overviews on our YouTube Channel.

๐ŸŽฆ Repository Visualization

Visualization of this repository

โš–๏ธ LICENSE

MIT ยฉ Open Sauced

explore.opensauced.pizza's People

Contributors

0-vortex avatar mtfoley avatar

Stargazers

 avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar

Forkers

mtfoley 0-vortex

explore.opensauced.pizza's Issues

Feature: Filter `gong` and `outreach` subgraphs

Type of feature

๐Ÿ“ฆ Chore

Current behavior

OneGraph has been updated to have new subgraphs for gong and outreach. Need to update our filtering to account for these.

Suggested solution

Update regular expression as in prior updates (such as in #31)

Additional context

N/A

Code of Conduct

  • I agree to follow this project's Code of Conduct

Contributing Docs

  • I agree to follow this project's Contribution Docs

Feature: Select Queries

Is your feature request related to a problem? Please describe.

As discussed in discord, may be good to have ability to choose queries (at least from the dynamic list).

Describe the solution you'd like

Dropdown to choose from queries, ability to edit and run query.
May be good to disable explorer altogether.

Describe alternatives you've considered

Additional context

There are concerns of usability with just the explorer enabled.

bug: GraphiQL Doc Explorer Loading State

Is your feature request related to a problem? Please describe.

Schema loading based on introspection query takes a while and it says "No Schema Available" in the explorer window while loading.

Describe the solution you'd like

Would be nice if this could read differently, where it could have a loading state.

Describe alternatives you've considered

Additional context

Screenshot of current condition while loading schema:
Screen Shot 2021-07-26 at 10 30 33 PM

Based on looking through some of the graphiql repo, we may need to pass schema prop in a different way: https://github.com/graphql/graphiql/blob/5b3e8c3e807c9911491617bb00d8b31f95189ae9/packages/graphiql/src/components/DocExplorer.tsx#L81

Feature: Filter new subgraph

Is your feature request related to a problem? Please describe.

Looks like OneGraph added another subgraph (terminology?) "chargebee"
image

Describe the solution you'd like

Update the schema filtering logic to account for this.
App.js

Feature: sync branch protections and other missing community files with opensauced.pizza

Is your feature request related to a problem? Please describe.

Branch protections and other simple community practices should be copied over from https://github.com/open-sauced before we have dot community files.

Describe the solution you'd like

I think https://github.com/octoherd/script-sync-branch-protections is the way to go?

Describe alternatives you've considered

Poking @bdougie to do it for me manually with little success

Additional context

Screenshot 2021-07-27 at 15 35 15

Feature: Filter notion subgraph

Is your feature request related to a problem? Please describe.

Subgraph for notion showing up in OneGraph's schema.

Describe the solution you'd like

Update filters to block this subgraph.

Describe alternatives you've considered

N/A

Additional context

Screenshot:
Screen Shot 2021-10-09 at 5 50 46 PM

Feature: improve semantic release mechanism

Is your feature request related to a problem? Please describe.

Improve the release mechanism similar to open-sauced but automated.

Describe the solution you'd like

Gold medal Olympics.

Describe alternatives you've considered

Additional context

Bug: static deploy is empty

Describe the bug

static deploy is empty

To Reproduce

visit explore.opensauced.pizza

Expected behavior

Screenshots

Additional context

Bug: Clicking very quickly causes app to crash

Describe the bug

Different implementations of GraphiQL feature code hints based on cursor position and/or mouse clicks, and this app does the same. Clicking in various places on the page very quickly causes the app to crash.

To Reproduce

  1. Install and run
  2. Click in various places very quickly for a few seconds

Expected behavior

App stays stable

Screenshots

Additional context

cc @0-vortex (originally reported)

Bug: schema not being shown

Describe the bug

Schema is not parsed correctly in production

Steps to reproduce

Open explore.opensauced.pizza
Note no schema shown
Find errors in console

Affected services

explore.opensauced.pizza

Platforms

Desktop, Mobile

Browsers

Chrome, Safari

Environment

Production

Additional context

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

Feature: make repository tooling more compact

Type of feature

Refactor

Current behavior

There are some unneeded files hanging around like .czrc and release.config.js, extraneous .gitattributes even.

Desired solution

Clean up some of these files, update dependencies to latest packages.

Additional context

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

Feature: update README file with some essential docs

Is your feature request related to a problem? Please describe.

The README file is missing descriptive sections of how to lint the app, how to run the automated conventional commit utility.

Describe the solution you'd like

Add 2+ sections to the README describing:

  • how to push with npm run push
  • what our release mechanism is
  • maybe screenshot stuff from release.config.js
  • anything else you feel is missing that is less worthy than a docs.opensauced.pizza section

Describe alternatives you've considered

Asking people to be GraphiQL gods ๐Ÿค—

Additional context

Feature: filter gmail and docusign

Type of feature

๐Ÿ• Feature

Current behavior

Schema explorer shows gmail and docusign subgraphs, having been added in OneGraph.
image

Suggested solution

Update regex in src/App.js

Additional context

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

Bug: Console Errors Due to GraphiQL Fetcher Prop

Describe the bug

When running the app, warnings are thrown in the console regarding UNSAFE_componentWillMount and UNSAFE_componentWillReceiveProps.

To Reproduce

Install and run npm ci, npm start, open in browser, open developer tools.

Expected behavior

No Console Errors (ideally)

Screenshots

Screen Shot 2021-07-26 at 10 17 47 PM

Additional context

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.