Merge pull request #2539 from supabase/docs/squad

Docs: squad

Makefile

@@ -2,17 +2,25 @@ REPO_DIR=$(shell pwd)
 
 help:
 	@echo "\SCRIPTS\n"
-	@echo "make github.users			# pull a list of all contributors"
+	@echo "make github.contributors  	# pull a list of all contributors"
 	@echo "make github.issues			# pull a list of all issue creators"
 	@echo "make github.repos			# pull a list of our repos"
 	@echo "make github.traction			# get a history of stargazers for our individual repos"
 
-github.users:
-	curl -sS https://api.github.com/repos/supabase/supabase/contributors \
-	| jq -r 'map_values({username: .login, avatar_url: .avatar_url}) \
+github.contributors.%:
+	curl -sS https://api.github.com/repos/supabase/$*/contributors \
+	| jq -r 'map_values({ username: .login }) \
 	| unique \
 	| sort_by(.username)' \
-	> $(REPO_DIR)/web/src/data/contributors/contributors.json
+	> $(REPO_DIR)/web/src/data/contributors/$*.json
+
+.PHONY: github.rcontributorsepos
+github.contributors: \
+	github.contributors.supabase \
+	github.contributors.supabase-js \
+	github.contributors.supabase-py \
+	github.contributors.supabase-flutter \
+	github.contributors.supabase-dart
 
 github.issues:
 	curl -sS https://api.github.com/repos/supabase/supabase/issues \

web/docs/handbook/contributing.mdx

@@ -4,42 +4,22 @@ title: Contributing
 description: Want to help?
 ---
 
+import Sponsors from '../../src/components/Sponsors'
+
 ## How to contribute
 
 Want to contribute? Why not jump into our GitHub repo and:
 
+- [Sponsor Supabase](https://github.com/sponsors/supabase).
+- [Answer Discussions](https://github.com/supabase/supabase/discussions).
 - Submit an issue.
 - Report a performance issue or a part of the documentation that you find confusing.
 - Create a pull request.
-- Try one of our products and give feedback.
-- Translate this website.
-- [Vote on a new client library](https://github.com/supabase/supabase/issues/5) for your favorite language.
+- [Translate our Readme](https://github.com/supabase/supabase/issues/1341).
+- Try our products and give feedback.
 - Spread the word if you like what we are doing.
-- Add your project or company to our showcase.
 
 
-## Contributors
-
-To add yourself as a contributor:
-
-Open [this page](https://github.com/supabase/supabase/blob/master/web/docs/handbook/contributing.mdx) on GitHub and then click the pencil icon.
-
-![Edit this page](/img/edit-contributors.png)
-
-Enter your GitHub profile name and link on a new line.
-
-![Add your Github handle](/img/add-contributor.png)
-
-Enter a title for your pull request and click "Propose Changes":
-
-![Submit PR](/img/propose-changes.png)
-
-One of the Supabase maintainers will approve your PR in the next few hours.
-
-<!-- Add your github handle below this line. Every name should be on a new line -->
-[awalias](https://github.com/awalias).
-[kiwicopple](https://github.com/kiwicopple).
-[abhinav-TB](https://github.com/abhinav-TB).
-[jacobfenger](https://github.com/jacobfenger).
-<!-- Add your github above this line. Every name should be on a new line -->
+## Sponsors
 
+<Sponsors />

web/docs/handbook/supasquad.mdx

@@ -0,0 +1,76 @@
+---
+id: supasquad
+title: SupaSquad
+description: Supabase Advocate program
+---
+
+The SupaSquad is an official Supabase advocate program where community members help build and manage the Supabase community.
+
+- Official recognition in the Supabase community.
+- Direct connection to the Supabase team.
+- Help steer the Supabase community.
+
+## Requirements
+
+As a member of the Squad, you choose the approach where you'll provide the most value.
+You can help in one of five ways:
+
+### Maintainer
+
+Help maintain Supabase repositories. This includes building client librararies, managing issues, and fixing bugs.
+
+### Expert
+
+Answer user questions on Github [Discussions](https://github.com/supabase/supabase/discussions), Discord, and various other social platforms.
+
+### Advocate
+
+Spread the word on social channels and help to answer Supabase-related questions in the broader community and social channels.
+
+### Builder
+
+Build Supabase examples, blog about them, and them add to the [SupaSquad GitHub Org](https://github.com/supasquad).
+
+### Author
+
+Write guest blog posts, create documentation, and help Supabase global expansion through translation.
+
+## Benefits for SupaSquad members
+
+- Access to a Supabase Discord channel providing direct communication with the team, Discord badges, and elevated privileges.
+- Special AMA sessions with members of the Supabase team.
+- Monthly DevRel committee call with industry-leading Developer Advocates (many of whom are [angel investors](https://supabase.io/blog/2021/03/25/angels-of-supabase)), where you can learn from the best.
+- We'll help you build your audience by promoting content via the Supabase social channels.
+- Featured profile on Supabase website.
+- Early access to new features (and the opportunity to provide feedback to the team!).
+- Free credits that you can use for Squad efforts.
+- Direct access to members of the Supabase team for questions, suggestions, etc.
+- Help shape the future of the program.
+- Invited to the [SupaSquad GitHub Org](https://github.com/supasquad) to collaborate with the other squad members.
+- Exclusive Supabase Team swag drops usually exclusively reserved to the Supabase core team.
+
+## How to join
+
+
+1. Apply to join the program using [this form](https://airtable.com/shr0FtLqLfhpuEya8).
+2. We will start taking interviewing members from `1 September 2021`.
+3. Entry is capped to 20 founding members so we can grow the community at a healthy pace and provide a great experience to all new users.
+4. Membership is valid for one year, and can be renewed every year.
+
+
+## FAQs
+
+<details>
+    <summary><i>Why are you only admitting 20 new members?</i></summary>
+    The entire Supabase team is only 20 people, so as you can imagine adding another 20 people sounds like a lot to us! We wish we could admit everyone who wanted to join. 
+    But we also want to make sure everyone who joins the Squad has an awesome experience. In the future we will probably expand the intake to include a monthly quota.
+</details>
+<details>
+    <summary><i>What is expected?</i></summary>
+    Mostly just enthusiasm. If you are interested in Open Source and want to get involved, the SupaSquad program is a great channel. You'll be given opportunities to contribute 
+    to the community in whatever ways match your skillset.
+</details>
+<details>
+    <summary><i>What if I become too busy to contribute?</i></summary>
+    No worries! The program isn't a job. It's just an opportunity to build your skillset and audience within the Supabase ecosystem.
+</details>

web/sidebars.js

@@ -97,7 +97,13 @@ module.exports = {
       type: 'category',
       label: 'See Also',
       collapsed: false,
-      items: ['handbook/contributing', 'company/terms', 'company/privacy', 'company/aup'],
+      items: [
+        'handbook/contributing',
+        'handbook/supasquad',
+        'company/terms',
+        'company/privacy',
+        'company/aup',
+      ],
     },
   ],
   guides: [

web/src/components/Sponsors.js

@@ -0,0 +1,71 @@
+import React from 'react'
+import sponsors from '../data/sponsors.json'
+
+
+export default function Sponsors() {
+
+  const tiers = [
+    {
+      tier_name: '$5,000 a month',
+      heading: 'Enterprise: $5,000 per month',
+      transactions: sponsors.filter((x) => (x.tier == '$5,000 a month')),
+    },
+    {
+      tier_name: '$2,500 a month',
+      heading: 'Agency: $2,500 per month',
+      transactions: sponsors.filter((x) => (x.tier == '$2,500 a month')),
+    },
+    {
+      tier_name: '$1,000 a month',
+      heading: 'Startup: $1,000 per month',
+      transactions: sponsors.filter((x) => (x.tier == '$1,000 a month')),
+    },
+    {
+      tier_name: '$49 a month',
+      heading: 'Evangelist: $49 per month',
+      transactions: sponsors.filter((x) => (x.tier == '$49 a month')),
+    },
+    {
+      tier_name: '$19 a month',
+      heading: 'Supporter: $19 per month',
+      transactions: sponsors.filter((x) => (x.tier == '$19 a month')),
+    },
+    {
+      tier_name: '$5 a month',
+      heading: 'Contributor: $5 per month',
+      transactions: sponsors.filter((x) => (x.tier == '$5 a month')),
+    },
+  ]
+
+  return (
+    <div >
+    
+          {tiers.map(
+            (t) =>
+              !!t.transactions.length && (
+                <>
+                  <h4 className="">{t.heading}</h4>
+                  <div className="row is-multiline" style={{ paddingLeft: 15 }}>
+                    {t.transactions.map((x) => (
+                      <div className="col col--3" key={x.sponsor}>
+                        <a className="avatar" href={`https://github.com/${x.sponsor}`}>
+                          <img
+                            className="avatar__photo avatar__photo--sm"
+                            src={`https://github.com/${x.sponsor}.png`}
+                          />
+                          <div className="avatar__intro">
+                            <h5 className="avatar__name" >{x.sponsor}</h5>
+                          </div>
+                        </a>
+                      </div>
+                    ))}
+                  </div>
+                  <br />
+                </>
+              )
+          )}
+          
+    </div>
+  )
+}
+

web/src/pages/oss.js

@@ -6,51 +6,19 @@ import maintainers from '../data/maintainers.json'
 import GithubCard from '../components/GithubCard'
 import { repos } from '../data/github'
 
+import Sponsors from '../components/Sponsors'
+
 export default function Oss() {
   const [activePill, setActivePill] = React.useState('All')
   const context = useDocusaurusContext()
   const { siteConfig = {} } = context
 
-  
-
   const maintainerTags = maintainers
     .reduce((acc, x) => acc.concat(x.tags), []) // get all tags
     .filter((v, i, a) => a.indexOf(v) === i) // remove duplicates
     .sort((a, b) => a.localeCompare(b)) // alphabetical
   const maintainerPills = ['All'].concat(maintainerTags)
-  const tiers = [
-    {
-      tier_name: '$5,000 a month',
-      heading: 'Enterprise: $5,000 per month',
-      transactions: sponsors.filter((x) => (x.tier == '$5,000 a month')),
-    },
-    {
-      tier_name: '$2,500 a month',
-      heading: 'Agency: $2,500 per month',
-      transactions: sponsors.filter((x) => (x.tier == '$2,500 a month')),
-    },
-    {
-      tier_name: '$1,000 a month',
-      heading: 'Startup: $1,000 per month',
-      transactions: sponsors.filter((x) => (x.tier == '$1,000 a month')),
-    },
-    {
-      tier_name: '$49 a month',
-      heading: 'Evangelist: $49 per month',
-      transactions: sponsors.filter((x) => (x.tier == '$49 a month')),
-    },
-    {
-      tier_name: '$19 a month',
-      heading: 'Supporter: $19 per month',
-      transactions: sponsors.filter((x) => (x.tier == '$19 a month')),
-    },
-    {
-      tier_name: '$5 a month',
-      heading: 'Contributor: $5 per month',
-      transactions: sponsors.filter((x) => (x.tier == '$5 a month')),
-    },
-  ]
-
+  
   return (
     <Layout title={`${siteConfig.title}`} description={siteConfig.tagline}>
       <section className={'section-lg'}>
@@ -71,30 +39,7 @@ export default function Oss() {
       <section className={'section-lg'}>
         <div className="container">
           <h2 className="with-underline">Sponsors</h2>
-          {tiers.map(
-            (t) =>
-              !!t.transactions.length && (
-                <>
-                  <h4 className="">{t.heading}</h4>
-                  <div className="row is-multiline">
-                    {t.transactions.map((x) => (
-                      <div className="col col--3" key={x.sponsor}>
-                        <a className="avatar" href={`https://github.com/${x.sponsor}`}>
-                          <img
-                            className="avatar__photo avatar__photo--sm"
-                            src={`https://github.com/${x.sponsor}.png`}
-                          />
-                          <div className="avatar__intro">
-                            <h5 className="avatar__name">{x.sponsor}</h5>
-                          </div>
-                        </a>
-                      </div>
-                    ))}
-                  </div>
-                  <br />
-                </>
-              )
-          )}
+          <Sponsors />
         </div>
       </section>
 
@@ -163,38 +108,3 @@ export default function Oss() {
     </Layout>
   )
 }
-
-function ContributorCard({ title, description, href, stars, handle }) {
-  return (
-    <a className={'card'} href={href} style={{ height: '100%' }}>
-      <div className="card__body">
-        <h4 style={styles.h4} style={{ margin: 0 }}>
-          {title.toUpperCase()}
-        </h4>
-        <small>{description}</small>
-      </div>
-      <hr style={styles.hr} />
-      <div style={styles.cardBase}>
-        <div>@{handle}</div>
-        <div>{stars} ★</div>
-      </div>
-    </a>
-  )
-}
-
-const styles = {
-  hr: {
-    margin: '15px 0 10px 0',
-  },
-  h3: {
-    margin: 0,
-    textTransform: 'capitalize',
-  },
-  cardBase: {
-    display: 'flex',
-    flexDirection: 'row',
-    justifyContent: 'space-between',
-    padding: '0 15px 10px 15px',
-    fontSize: '0.8em',
-  },
-}