[tutorials] Replace "Block Creation" in the wallet splash page (#3933)

app/components/views/GetStartedPage/LoadingPage/LoadingPage.jsx

@@ -1,6 +1,7 @@
 import {
   TutorialOverview,
-  tutorials
+  tutorials,
+  tutorialList
 } from "../../SettingsPage/TutorialsTab/helpers";
 import { Subtitle } from "shared";
 import { FormattedMessage as T } from "react-intl";
@@ -18,16 +19,7 @@ const LoadingPage = ({ onShowOnboardingTutorial }) => {
           />
         }
       />
-      {[
-        "decredIntro",
-        "ln",
-        "consensusCode",
-        "powPos",
-        "tickets",
-        "staking",
-        "lifecycle",
-        "consensusVoting"
-      ].map((name) => (
+      {tutorialList.map((name) => (
         <TutorialOverview
           {...{
             key: name,

app/components/views/GetStartedPage/WalletSelection/Form/Form.jsx

@@ -14,7 +14,8 @@ import { FormContainer, ContentContainer /* , Row */ } from "../../helpers";
 import styles from "./Form.module.css";
 import {
   TutorialOverview,
-  tutorials
+  tutorials,
+  tutorialShortList
 } from "../../../SettingsPage/TutorialsTab/helpers";
 import {
   LoaderTitleMsg,
@@ -302,7 +303,7 @@ const WalletSelectionForm = ({
           />
         }
       />
-      {["decredIntro", "powPos", "lifecycle", "blocks"].map((name) => (
+      {tutorialShortList.map((name) => (
         <TutorialOverview
           {...{
             key: name,

app/components/views/SettingsPage/TutorialsTab/TutorialsTab.jsx

@@ -1,6 +1,11 @@
 import { FormattedMessage as T } from "react-intl";
 import { Subtitle } from "shared";
-import { TutorialOverview, TutorialPage, tutorials } from "./helpers";
+import {
+  TutorialOverview,
+  TutorialPage,
+  tutorials,
+  tutorialList
+} from "./helpers";
 import { useTutorialsTab } from "./hooks";
 import styles from "./TutorialsTab.module.css";
 
@@ -40,16 +45,7 @@ const TutorialsTab = () => {
       <Subtitle
         title={<T id="tutorials.learnAboutDecred" m="Learn about decred" />}
       />
-      {[
-        "decredIntro",
-        "ln",
-        "consensusCode",
-        "powPos",
-        "tickets",
-        "staking",
-        "lifecycle",
-        "consensusVoting"
-      ].map((name) => (
+      {tutorialList.map((name) => (
         <TutorialOverview
           {...{
             key: name,

app/components/views/SettingsPage/TutorialsTab/helpers/index.js

@@ -2,4 +2,8 @@ export { default as TutorialCard } from "./TutorialCard";
 export { default as TutorialOverview } from "./TutorialOverview";
 export { default as TutorialPage } from "./TutorialPage";
 export { default as PagedTutorial } from "./PagedTutorial";
-export { default as tutorials } from "./tutorials";
+export {
+  default as tutorials,
+  tutorialList,
+  tutorialShortList
+} from "./tutorials";

app/components/views/SettingsPage/TutorialsTab/helpers/tutorials.js

@@ -4,21 +4,21 @@ const tutorials = {};
 
 tutorials.decredIntro = {
   title: "Decred Intro",
-  desc: "Learn how and why Decred was created.", // TODO
+  desc: "Learn how and why Decred was created.",
   thumbnailImage: "decredIntroThumb",
   slides: [
     {
       label: (
         <T id="tutorials.decredIntro.label1" m="Why was Decred created?" />
-      ), // TODO
+      ),
       doc: "DecredIntoPage01",
       title: (
         <T id="tutorials.decredIntro.title1" m="Why was Decred created?" />
       ),
       images: ["decredIntroSlideImage1"]
     },
     {
-      label: <T id="tutorials.decredIntro.label2" m="Governance systems" />, // TODO
+      label: <T id="tutorials.decredIntro.label2" m="Governance systems" />,
       doc: "DecredIntoPage02",
       title: (
         <T
@@ -33,7 +33,7 @@ tutorials.decredIntro = {
 
 tutorials.ln = {
   title: "What is Lightning Network?",
-  desc: "Learn the basics of Lightning Network, our 2nd layer implementation for super fast transactions.", // TODO
+  desc: "Learn the basics of Lightning Network, our 2nd layer implementation for super fast transactions.",
   thumbnailImage: "lnThumb",
   slides: [
     {
@@ -109,11 +109,11 @@ tutorials.ln = {
 
 tutorials.consensusCode = {
   title: "Consensus Code",
-  desc: "Most other coins don't upgrade consensus code in a fair or decentralized way.  Decred's voting system allows for smooth upgrades that are easily understood.", // TODO
+  desc: "Most other coins don't upgrade consensus code in a fair or decentralized way.  Decred's voting system allows for smooth upgrades that are easily understood.",
   thumbnailImage: "consensusCodeThumb",
   slides: [
     {
-      label: <T id="tutorials.consensusCode.label1" m="Consensus Code" />, // TODO
+      label: <T id="tutorials.consensusCode.label1" m="Consensus Code" />,
       doc: "ConsensusCodePage01",
       title: (
         <T id="tutorials.consensusCode.title1" m="Focus on Consensus Code" />
@@ -125,23 +125,23 @@ tutorials.consensusCode = {
 
 tutorials.powPos = {
   title: "Hybrid PoW/PoS",
-  desc: "With a hybrid system, we've taken the best features of both PoW and PoS to obtain fair and secure block creation.", // TODO
+  desc: "With a hybrid system, we've taken the best features of both PoW and PoS to obtain fair and secure block creation.",
   thumbnailImage: "powPosThumb",
   slides: [
     {
-      label: <T id="tutorials.powPos.label1" m="PoW" />, // TODO
+      label: <T id="tutorials.powPos.label1" m="PoW" />,
       doc: "PowPosPage01",
       title: <T id="tutorials.powPos.title1" m="Proof-of-Work" />,
       images: ["powPosSlideImage1"]
     },
     {
-      label: <T id="tutorials.powPos.label2" m="PoS" />, // TODO
+      label: <T id="tutorials.powPos.label2" m="PoS" />,
       doc: "PowPosPage02",
       title: <T id="tutorials.powPos.title2" m="Proof-of-Stake" />,
       images: ["powPosSlideImage2"]
     },
     {
-      label: <T id="tutorials.powPos.label3" m="Hybrid PoW/PoS" />, // TODO
+      label: <T id="tutorials.powPos.label3" m="Hybrid PoW/PoS" />,
       doc: "PowPosPage03",
       title: (
         <T
@@ -156,11 +156,11 @@ tutorials.powPos = {
 
 tutorials.tickets = {
   title: "Staking and Tickets",
-  desc: "Staking doesn't have to be complicated. Decred's system of tickets and votes makes it easy to understand how your hard-earned DCR can be put to use.", // TODO
+  desc: "Staking doesn't have to be complicated. Decred's system of tickets and votes makes it easy to understand how your hard-earned DCR can be put to use.",
   thumbnailImage: "ticketsThumb",
   slides: [
     {
-      label: <T id="tutorials.tickets.label1" m="Buying tickets" />, // TODO
+      label: <T id="tutorials.tickets.label1" m="Buying tickets" />,
       doc: "TicketsPage01",
       title: (
         <T
@@ -171,13 +171,13 @@ tutorials.tickets = {
       images: ["ticketsSlideImage1"]
     },
     {
-      label: <T id="tutorials.tickets.label2" m="Tickets have multiple uses" />, // TODO
+      label: <T id="tutorials.tickets.label2" m="Tickets have multiple uses" />,
       doc: "TicketsPage02",
       title: <T id="tutorials.tickets.title2" m="Tickets have multiple uses" />,
       images: ["ticketsSlideImage2-1", "ticketsSlideImage2-2"]
     },
     {
-      label: <T id="tutorials.tickets.label3" m="Rewards" />, // TODO
+      label: <T id="tutorials.tickets.label3" m="Rewards" />,
       doc: "TicketsPage03",
       title: <T id="tutorials.tickets.title3" m="Rewards" />,
       images: ["ticketsSlideImage3-1", "ticketsSlideImage3-2"]
@@ -187,25 +187,25 @@ tutorials.tickets = {
 
 tutorials.staking = {
   title: "Core Functions of Staking",
-  desc: "Learn about the core functions of staking, and how your votes lead to real changes.", // TODO
+  desc: "Learn about the core functions of staking, and how your votes lead to real changes.",
   thumbnailImage: "stakingThumb",
   slides: [
     {
-      label: <T id="tutorials.staking.label1" m="Previous Block Validation" />, // TODO
+      label: <T id="tutorials.staking.label1" m="Previous Block Validation" />,
       doc: "StakingPage01",
       title: <T id="tutorials.staking.title1" m="Previous Block Validation" />,
       images: ["stakingSlideImage1"]
     },
     {
-      label: <T id="tutorials.staking.label2" m="Consensus Changes" />, // TODO
+      label: <T id="tutorials.staking.label2" m="Consensus Changes" />,
       doc: "StakingPage02",
       title: <T id="tutorials.staking.title2" m="Consensus Changes" />,
       images: ["stakingSlideImage2"]
     },
     {
       label: (
         <T id="tutorials.staking.label3" m="Treasury and Project Management" />
-      ), // TODO
+      ),
       doc: "StakingPage03",
       title: (
         <T id="tutorials.staking.title3" m="Treasury and Project Management" />
@@ -222,35 +222,35 @@ tutorials.staking = {
 
 tutorials.lifecycle = {
   title: "Ticket Lifecycle",
-  desc: "Learn all about how a ticket is created, consumed, and the rewards for voting.", // TODO
+  desc: "Learn all about how a ticket is created, consumed, and the rewards for voting.",
   thumbnailImage: "lifecycleThumb",
   slides: [
     {
-      label: <T id="tutorials.lifecycle.label1" m="Tickets to real rewards" />, // TODO
+      label: <T id="tutorials.lifecycle.label1" m="Tickets to real rewards" />,
       doc: "LifecyclePage01",
       title: <T id="tutorials.lifecycle.title1" m="Tickets to real rewards" />,
       images: ["lifecycleSlideImage1-1", "lifecycleSlideImage1-2"]
     },
     {
-      label: <T id="tutorials.lifecycle.label2" m="Ticket's Lifecycle" />, // TODO
+      label: <T id="tutorials.lifecycle.label2" m="Ticket's Lifecycle" />,
       doc: "LifecyclePage02",
       title: <T id="tutorials.lifecycle.label2" m="Ticket's Lifecycle" />,
       images: ["lifecycleSlideImage2"]
     },
     {
-      label: <T id="tutorials.lifecycle.label3" m="Immature tickets" />, // TODO
+      label: <T id="tutorials.lifecycle.label3" m="Immature tickets" />,
       doc: "LifecyclePage03",
       title: <T id="tutorials.lifecycle.title3" m="Immature tickets" />,
       images: ["lifecycleSlideImage3-1", "lifecycleSlideImage3-2"]
     },
     {
-      label: <T id="tutorials.lifecycle.label4" m="Live Tickets" />, // TODO
+      label: <T id="tutorials.lifecycle.label4" m="Live Tickets" />,
       doc: "LifecyclePage04",
       title: <T id="tutorials.lifecycle.title4" m="Live Tickets" />,
       images: ["lifecycleSlideImage4-1", "lifecycleSlideImage4-2"]
     },
     {
-      label: <T id="tutorials.lifecycle.label5" m="Voted Tickets" />, // TODO
+      label: <T id="tutorials.lifecycle.label5" m="Voted Tickets" />,
       doc: "LifecyclePage05",
       title: <T id="tutorials.lifecycle.title5" m="Voted Tickets" />,
       images: [
@@ -261,7 +261,7 @@ tutorials.lifecycle = {
       ]
     },
     {
-      label: <T id="tutorials.lifecycle.label6" m="Missed or Expired" />, // TODO
+      label: <T id="tutorials.lifecycle.label6" m="Missed or Expired" />,
       doc: "LifecyclePage06",
       title: <T id="tutorials.lifecycle.title6" m="Missed or Expired" />,
       images: [
@@ -395,4 +395,23 @@ tutorials.identity = {
     }
   ]
 };
+
+export const tutorialList = [
+  "decredIntro",
+  "ln",
+  "consensusCode",
+  "powPos",
+  "tickets",
+  "staking",
+  "lifecycle",
+  "consensusVoting"
+];
+
+export const tutorialShortList = [
+  "decredIntro",
+  "powPos",
+  "lifecycle",
+  "consensusCode"
+];
+
 export default tutorials;