Merge pull request #211 from gridaco/staging

Improved Early Access Guarding

Author: softmarshmallow

app/lib/pages/about/manifest.ts

@@ -1,4 +1,4 @@
 // const _package = require("../package.jsonn");
 export const name = "Grida Assistant";
-export const version = "2022.3.1f0"; /*_package.version*/
+export const version = "2023.3.1f0"; /*_package.version*/
 export const versionText = `v${version}`;

packages/_firstparty-early-access/guards/index.ts

@@ -0,0 +1,17 @@
+import { useEarlyAccess } from "@assistant-fp/early-access";
+import { useHistory } from "react-router-dom";
+import { early_access_required_message } from "../k";
+
+export function requiresEarlyAccess<T extends Function>(f: T): T {
+  const history = useHistory();
+  const ea = useEarlyAccess();
+
+  if (!ea) {
+    return ((...args) => {
+      alert(early_access_required_message);
+      history.push("/upgrade");
+    }) as any as T;
+  } else {
+    return f;
+  }
+}

packages/_firstparty-early-access/hooks/index.ts

@@ -0,0 +1 @@
+export * from "./use-early-access";

packages/_firstparty-early-access/hooks/use-early-access.tsx

@@ -0,0 +1,15 @@
+import React, { useEffect, useState } from "react";
+import store from "../store";
+
+export function useEarlyAccess() {
+  const [accesskey, setAccessKey] = useState<string | null>(null);
+  useEffect(() => {
+    store.get().then((d) => {
+      if (d) {
+        setAccessKey(d);
+      }
+    });
+  }, []);
+
+  return accesskey;
+}

packages/_firstparty-early-access/index.ts

@@ -1 +1,4 @@
 export { UpgradePage } from "./register";
+export * from "./guards";
+export * from "./hooks";
+export { default as store } from "./store";

packages/_firstparty-early-access/k.ts

@@ -0,0 +1,3 @@
+export const __key = "assistant-early-access-activation";
+export const early_access_required_message =
+  "This is a pro feature, please activate";

packages/_firstparty-early-access/scaffolds/register-with-code-card.tsx

@@ -1,8 +1,7 @@
 import React, { useState, useEffect } from "react";
 import styled from "@emotion/styled";
 import { PluginSdk } from "@plugin-sdk/app";
-
-const __key = "assistant-early-access-activation";
+import { store } from "@assistant-fp/early-access";
 
 const __form_key_min_length = 24;
 
@@ -11,7 +10,7 @@ export function RegisterWithCodeCard() {
   const [isTokenFormatValid, setIsTokenFormatValid] = useState(false);
 
   useEffect(() => {
-    PluginSdk.getItem(__key).then((code) => {
+    store.get().then((code) => {
       verify(code).then((verified) => {
         setVerified(verified);
       });
@@ -36,7 +35,7 @@ export function RegisterWithCodeCard() {
   const activate = (code: string) => {
     verify(code).then((verified) => {
       if (verified) {
-        PluginSdk.setItem(__key, code);
+        store.set(code);
         setVerified(true);
         alert("Congrats🎉 Early access program activated.");
       } else {

packages/_firstparty-early-access/store.ts

@@ -0,0 +1,13 @@
+import { __key } from "./k";
+import { PluginSdk } from "@plugin-sdk/app";
+
+const store = {
+  set: (value: any) => {
+    return PluginSdk.setItem(__key, value);
+  },
+  get: async () => {
+    return await PluginSdk.getItem(__key);
+  },
+};
+
+export default store;

packages/app-design-lint/fix-your-self.tsx

@@ -7,6 +7,7 @@ import { LintItemRow } from "@app/design-lint";
 import { LintProcessPaginator } from "@app/design-lint/lint-process-paginator";
 import { _APP_EVENT_LINT_RESULT_EK } from "@app/design-lint/__plugin/events";
 import BackArrowIcon from "@assistant/icons/back-arrow";
+import { requiresEarlyAccess } from "@assistant-fp/early-access";
 
 /** Fix your self as page with router props ver. (not used. planned.) */
 export function FixYourSelfPage(props: {
@@ -43,12 +44,12 @@ export function FixYourSelf(props: {
     chaange_layer_index(0);
   }, []);
 
-  const chaange_layer_index = (i) => {
+  const chaange_layer_index = requiresEarlyAccess((i) => {
     setLayerIndex(i);
     const _target = layerlintMap.get(_key_at_index(i));
     setLayerLint(_target);
     PluginSdk.focus(_target.node.id);
-  };
+  });
 
   const _page_size = layerlintMap.size;
 

packages/app-design-lint/lint-screen.tsx

@@ -19,6 +19,7 @@ import { makeSummary, requestLintOnCurrentSelection } from "./actions";
 import { FixYourSelf } from "./fix-your-self";
 import { mapGrandchildren } from "@design-sdk/core/utils";
 import Dialog from "@material-ui/core/Dialog";
+import { requiresEarlyAccess } from "@assistant-fp/early-access";
 
 export const LintScreen = () => {
   const [feedbacks, setFeedbacks] = useState<ReflectLintFeedback[]>([]);
@@ -50,10 +51,10 @@ export const LintScreen = () => {
     }).length;
   }
 
-  function onFeedbackTap(feedback: ReflectLintFeedback) {
+  const onFeedbackTap = requiresEarlyAccess((feedback: ReflectLintFeedback) => {
     const targetNodeId = feedback.node.id;
     PluginSdk.focus(targetNodeId);
-  }
+  });
 
   function handleSelectionLayer() {
     const summary = makeSummary(feedbacks);