New source found from dndbeyond.com

ddb_main/subApps/sheet/components/Sidebar/panes/FeatsManagePane/BlessingShoppe/BlessingShoppe.tsx

@@ -1,105 +0,0 @@
-import { FC, useContext, useEffect, useState } from "react";
-
-import { FeatureManager } from "@dndbeyond/character-rules-engine";
-
-import { ThemeButton } from "~/tools/js/Shared/components/common/Button";
-import DataLoadingStatusEnum from "~/tools/js/Shared/constants/DataLoadingStatusEnum";
-import { CharacterFeaturesManagerContext } from "~/tools/js/Shared/managers/CharacterFeaturesManagerContext";
-import { AppLoggerUtils, AppNotificationUtils } from "~/tools/js/Shared/utils";
-import Collapsible, {
-  CollapsibleHeaderContent,
-} from "~/tools/js/smartComponents/Collapsible";
-
-export const BlessingShoppe: FC<{}> = () => {
-  const { characterFeaturesManager } = useContext(
-    CharacterFeaturesManagerContext
-  );
-
-  const [loadingStatus, setLoadingStatus] = useState<DataLoadingStatusEnum>(
-    DataLoadingStatusEnum.NOT_INITIALIZED
-  );
-  const [blessingShoppe, setBlessingShoppe] = useState<Array<FeatureManager>>(
-    []
-  );
-  const [blessings, setBlessings] = useState<Array<FeatureManager>>([]);
-
-  async function fetchBlessings() {
-    const blessings = await characterFeaturesManager.getBlessings();
-    setBlessings(blessings);
-  }
-
-  useEffect(() => {
-    if (loadingStatus !== DataLoadingStatusEnum.LOADED) {
-      characterFeaturesManager
-        .getBlessingShoppe()
-        .then((blessingShoppe) => {
-          setLoadingStatus(DataLoadingStatusEnum.LOADED);
-          setBlessingShoppe(blessingShoppe);
-        })
-        .catch(AppLoggerUtils.handleAdhocApiError);
-    }
-    fetchBlessings();
-  }, [loadingStatus, characterFeaturesManager]);
-
-  return (
-    <div>
-      <p>
-        A blessing is usually bestowed by a god or a godlike being. A character
-        might receive a blessing from a deity for doing something truly
-        momentous — an accomplishment that catches the attention of both gods
-        and mortals.
-      </p>
-      <div>
-        {blessingShoppe.map((blessing) => {
-          return (
-            <Collapsible
-              key={blessing.getId()}
-              layoutType={"minimal"}
-              header={
-                <CollapsibleHeaderContent
-                  heading={blessing.getName()}
-                  callout={
-                    characterFeaturesManager.hasBlessing(blessing) ? (
-                      <ThemeButton
-                        onClick={() => {
-                          blessing.handleRemove(() => {
-                            fetchBlessings();
-                            // AppNotificationUtils.dispatchSuccess(
-                            //     'Removed Blessing',
-                            //     'You removed a blessing',
-                            // );
-                          });
-                        }}
-                        size="small"
-                      >
-                        Remove
-                      </ThemeButton>
-                    ) : (
-                      <ThemeButton
-                        onClick={() => {
-                          blessing.handleAdd(() => {
-                            fetchBlessings();
-                            AppNotificationUtils.dispatchSuccess(
-                              "Added Blessing",
-                              "You added a blessing"
-                            );
-                          });
-                        }}
-                        size="small"
-                        style="outline"
-                      >
-                        Add
-                      </ThemeButton>
-                    )
-                  }
-                />
-              }
-            >
-              {blessing.getDescription()}
-            </Collapsible>
-          );
-        })}
-      </div>
-    </div>
-  );
-};

ddb_main/subApps/sheet/components/Sidebar/panes/FeatsManagePane/FeatDetail/FeatDetail.tsx

@@ -1,5 +1,4 @@
 import { FC, HTMLAttributes } from "react";
-import { useDispatch } from "react-redux";
 
 import {
   characterActions,
@@ -9,6 +8,7 @@ import {
 
 import { HtmlContent } from "~/components/HtmlContent";
 import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { useDispatch } from "~/hooks/useDispatch";
 import { DetailChoice } from "~/tools/js/Shared/containers/DetailChoice";
 
 import styles from "./styles.module.css";

ddb_main/subApps/sheet/components/Sidebar/panes/FeatsManagePane/FeatsManagePane.tsx

@@ -1,23 +1,14 @@
 import { FC } from "react";
 import { useSelector } from "react-redux";
 
-import { useFeatureFlags } from "~/contexts/FeatureFlag";
+import { SettingsButton } from "~/subApps/sheet/components/SettingsButton";
 import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
-import SettingsButton from "~/tools/js/CharacterSheet/components/SettingsButton";
 import { SettingsContextsEnum } from "~/tools/js/Shared/containers/panes/SettingsPane/typings";
 import { appEnvSelectors } from "~/tools/js/Shared/selectors";
-import Collapsible, {
-  CollapsibleHeaderContent,
-  CollapsibleHeading,
-} from "~/tools/js/smartComponents/Collapsible";
 
-import { BlessingShoppe } from "./BlessingShoppe";
 import { FeatShoppe } from "./FeatShoppe";
-import styles from "./styles.module.css";
 
 export const FeatsManagePane: FC<{}> = () => {
-  const { gfsBlessingsUiFlag } = useFeatureFlags();
-
   const isReadonly = useSelector(appEnvSelectors.getIsReadonly);
   if (isReadonly) {
     return null;
@@ -27,40 +18,14 @@ export const FeatsManagePane: FC<{}> = () => {
     <div>
       <Header
         callout={
-          <SettingsButton
-            context={SettingsContextsEnum.FEATURES}
-            isReadonly={isReadonly}
-          />
+          !isReadonly && (
+            <SettingsButton context={SettingsContextsEnum.FEATURES} />
+          )
         }
       >
-        Manage {gfsBlessingsUiFlag ? "Features" : "Feats"}
+        Manage Feats
       </Header>
-      {gfsBlessingsUiFlag ? (
-        <Collapsible
-          header={
-            <CollapsibleHeaderContent
-              heading={<CollapsibleHeading>Add Feats</CollapsibleHeading>}
-            />
-          }
-          className={styles.featList}
-        >
-          <FeatShoppe />
-        </Collapsible>
-      ) : (
-        <FeatShoppe />
-      )}
-      {gfsBlessingsUiFlag && (
-        <Collapsible
-          header={
-            <CollapsibleHeaderContent
-              heading={<CollapsibleHeading>Add Blessings</CollapsibleHeading>}
-            />
-          }
-          className={styles.featList}
-        >
-          <BlessingShoppe />
-        </Collapsible>
-      )}
+      <FeatShoppe />
     </div>
   );
 };