Fixes

.env.sample

@@ -6,12 +6,7 @@ DAEMON_URL=
 # /developer-program
 GITHUB_APP_ID=
 GITHUB_APP_SECRET=
-
-GITHUB_APP_ID_TEST=
-GITHUB_APP_SECRET_TEST=
-
 REWARD_URL=
-REWARD_URL_TEST=
 
 # https://developer.github.com/apps/building-oauth-apps/creating-an-oauth-app
 # We use this to show the GitHub feed on the homepage

app/components/client/devprogram-scripts.js

@@ -19,6 +19,14 @@ if (window.location.search.includes("?code=")) {
         <button id="creditsAcquire" title="Get LBRY credits" type="button">Get credits</button>
       </input-submit>
     </form>
+
+    <p>To receive your LBC, you'll need a wallet address. While graphical wallets are available, the recommended path for engineers is to:</p>
+
+    <ol>
+      <li>Download <a href="https://github.com/lbryio/lbry">the LBRY SDK</a>.</li>
+      <li>Launch the command-line utility.</li>
+      <li>Run the <a href="https://lbry.tech/api/sdk#address_unused"><code>address_unused</code></a> command.</li>
+    </ol>
   `;
 
   history.replaceState({}, "", window.location.pathname); // clean up URL bar

app/components/developer-program.js

@@ -10,8 +10,23 @@ import html from "choo/html";
 
 //  E X P O R T
 
-export default () => html`
+export default () => {
+  if (
+    !process.env.GITHUB_APP_ID ||
+    !process.env.GITHUB_APP_SECRET ||
+    !process.env.REWARD_URL
+  ) {
+    return html`
       <developer-program>
-    <p>If this sounds like you, <a href="#" class="no-smooth" id="get-started">get started here</a>!</p>
+        <p><strong>Environment variables required to enable functionality are missing.</strong></p>
       </developer-program>
-`;
+    `;
+  }
+
+  return html`
+    <developer-program>
+      <button class="button" id="get-started">Claim Developer LBC</button>
+      <small class="meta">This will authenticate you with GitHub to prove eligibility as well as mark you as a follower of LBRY.</small>
+    </developer-program>
+  `;
+};

app/dist/scripts/api.js

@@ -45,14 +45,9 @@ function handleApiLanguageToggles(language) {
     const examples = document.querySelectorAll("[data-api-example-type]");
     const toggles = document.querySelectorAll("*[id^='toggle-']");
 
-    for (const example of examples)
+    examples.forEach(example => example.classList.remove("active"));
-      example.classList.remove("active");
+    codeExamples.forEach(example => example.classList.add("active"));
-
+    toggles.forEach(example => example.classList.remove("active"));
-    for (const example of codeExamples)
-      example.classList.add("active");
-
-    for (const toggle of toggles)
-      toggle.classList.remove("active");
 
     document.getElementById(`toggle-${language}`).classList.add("active");
   });

app/sass/pages/_developer.scss

@@ -1,3 +1,14 @@
 developer-program {
   @extend %markdown;
+
+  .button {
+    margin: 2rem auto 1rem;
+    display: block;
+  }
+
+  small {
+    display: block;
+    font-size: 0.8rem;
+    text-align: center;
+  }
 }

app/sockets.js

@@ -13,17 +13,15 @@ import fetchMetadata from "@helper/fetch-metadata";
 import { generateGitHubFeed } from "@helper/github";
 import messageSlack from "@helper/slack";
 
-const apiUrl = process.env.NODE_ENV === "development" ?
+let apiUrl = process.env.REWARD_URL;
-  process.env.REWARD_URL_TEST :
+let githubAppId = process.env.GITHUB_APP_ID;
-  process.env.REWARD_URL;
+let githubAppSecret = process.env.GITHUB_APP_SECRET;
 
-const githubAppId = process.env.NODE_ENV === "development" ?
+if (process.env.NODE_ENV === "development") {
-  process.env.GITHUB_APP_ID_TEST :
+  apiUrl = process.env.REWARD_URL_TEST;
-  process.env.GITHUB_APP_ID;
+  githubAppId = process.env.GITHUB_APP_ID_TEST;
-
+  githubAppSecret = process.env.GITHUB_APP_SECRET_TEST;
-const githubAppSecret = process.env.NODE_ENV === "development" ?
+}
-  process.env.GITHUB_APP_SECRET_TEST :
-  process.env.GITHUB_APP_SECRET;
 
 
 

documents/developer-program.md

@@ -10,11 +10,3 @@ To qualify you must:
 - Have made a public pull request within the past year.
 
 <DeveloperProgram/>
-
-(below here should be hidden until click)
-
-To receive your LBC, you'll need a wallet address. While graphical wallets are available, the recommended path for engineers is to:
- 
-1. Download [the LBRY SDK](https://github/lbryio/lbry).
-1. Launch the command-line utility.
-1. Run the [`address_unused`](https://lbry.tech/api/sdk#address_unused) command.