fix other story

saasquatch · Oct 2, 2024 · 9f60626 · 9f60626
1 parent e7145ad
commit 9f60626
Showing 1 changed file with 13 additions and 16 deletions.
diff --git a/packages/react/src/component-metamodel/ComponentModel.stories.tsx b/packages/react/src/component-metamodel/ComponentModel.stories.tsx
@@ -1,8 +1,7 @@
 import { htmlParser, RaisinElementNode } from '@raisins/core';
 import { Meta } from '@storybook/react';
-import { useAtom } from 'jotai';
 import { useMolecule } from 'bunshi/react';
-import { useAtomValue, useUpdateAtom } from 'jotai/utils';
+import { useAtom, useAtomValue, useSetAtom } from 'jotai';
 import React from 'react';
 import {
   AttributeProvider,
@@ -99,7 +98,7 @@ const BlocksController = () => {
       }}
     >
       <h2>Blocks</h2>
-      {(blocks.length ? blocks : fakeBlocks).map((block) => {
+      {(blocks.length ? blocks : fakeBlocks).map(block => {
         return (
           <div
             style={{
@@ -122,9 +121,7 @@ const BlocksController = () => {
   );
 };
 
-export const CustomAttributesController: React.FC<AttributesControllerProps> = (
-  props
-) => {
+export const CustomAttributesController: React.FC<AttributesControllerProps> = props => {
   const { keysAtom, groupedSchemaAtom } = useMolecule(AttributesMolecule);
   const keys = useAtomValue(keysAtom);
   const groupedSchema = useAtomValue(groupedSchemaAtom);
@@ -136,7 +133,7 @@ export const CustomAttributesController: React.FC<AttributesControllerProps> = (
       {Object.keys(groupedSchema).map((key, idx) => {
         return (
           <>
-            {groupedSchema[key].map((attribute) => {
+            {groupedSchema[key].map(attribute => {
               return (
                 <AttributeProvider
                   attributeName={attribute.name}
@@ -307,7 +304,7 @@ const CustomThemeTest = () => {
     <>
       <textarea
         value={html}
-        onInput={(e) => setHtml((e.target as HTMLTextAreaElement).value)}
+        onInput={e => setHtml((e.target as HTMLTextAreaElement).value)}
         rows={6}
         style={{ width: '300px' }}
       />
@@ -354,9 +351,9 @@ function usePackageEditor(): ModuleManagement {
     loadingModules: useAtomValue(ModulesLoadingAtom),
     modules: useAtomValue(ModulesAtom),
     moduleDetails: useAtomValue(ModuleDetailsAtom),
-    addModule: useUpdateAtom(AddModuleAtom),
-    removeModule: useUpdateAtom(RemoveModuleAtom),
-    removeModuleByName: useUpdateAtom(RemoveModuleByNameAtom),
+    addModule: useSetAtom(AddModuleAtom),
+    removeModule: useSetAtom(RemoveModuleAtom),
+    removeModuleByName: useSetAtom(RemoveModuleByNameAtom),
   };
 }
 
@@ -379,7 +376,7 @@ function PackageEditorView(props: ModuleManagement) {
       <div>Loading: {props.loadingModules}</div>
       Modules:
       <ul>
-        {props.modules.map((m) => (
+        {props.modules.map(m => (
           <li key={m.package + '@' + m.version + '/' + m.filePath}>
             {m.package} @ {m.version} for {m.filePath}
           </li>
@@ -411,7 +408,7 @@ function PackageEditorView(props: ModuleManagement) {
       <h2>Add</h2>
       <button
         onClick={() => {
-          setOfThings.map((m) => props.addModule(m));
+          setOfThings.map(m => props.addModule(m));
         }}
       >
         Shoelace + theme
@@ -441,11 +438,11 @@ function PackageEditorView(props: ModuleManagement) {
         Mint (alpha)
       </button>
       <ul>
-        {PACKAGES.map((m) => {
+        {PACKAGES.map(m => {
           return (
             <li key={m}>
               <button
-                onClick={(e) => {
+                onClick={e => {
                   props.addModule({
                     package: m,
                   });
@@ -459,7 +456,7 @@ function PackageEditorView(props: ModuleManagement) {
       </ul>
       <h2>Remove</h2>
       <ul>
-        {PACKAGES.map((m) => {
+        {PACKAGES.map(m => {
           return (
             <li key={m}>
               <button onClick={() => props.removeModuleByName(m)}>{m}</button>