diff --git a/framegear/components/Frame/Frame.tsx b/framegear/components/Frame/Frame.tsx
index 32653ec4ab..d4974e0664 100644
--- a/framegear/components/Frame/Frame.tsx
+++ b/framegear/components/Frame/Frame.tsx
@@ -1,5 +1,5 @@
import { postFrame } from '@/utils/postFrame';
-import { frameResultsAtom } from '@/utils/store';
+import { frameResultsAtom, mockFrameOptionsAtom } from '@/utils/store';
import { useAtom } from 'jotai';
import { ChangeEvent, PropsWithChildren, useCallback, useMemo, useState } from 'react';
import { ExternalLinkIcon, ResetIcon, RocketIcon } from '@radix-ui/react-icons';
@@ -62,6 +62,7 @@ function ValidFrame({ metadata }: { metadata: FrameMetadataWithImageObject }) {
)}
+
);
}
@@ -102,26 +103,30 @@ function FrameButton({
const { openModal } = useRedirectModal();
const [isLoading, setIsLoading] = useState(false);
const [_, setResults] = useAtom(frameResultsAtom);
+ const [mockFrameOptions] = useAtom(mockFrameOptionsAtom);
const handleClick = useCallback(async () => {
if (button?.action === 'post' || button?.action === 'post_redirect') {
// TODO: collect user options (follow, like, etc.) and include
const confirmAction = async () => {
- const result = await postFrame({
- buttonIndex: index,
- url: button.target!,
- state: JSON.stringify(state),
- // TODO: make these user-input-driven
- castId: {
+ const result = await postFrame(
+ {
+ buttonIndex: index,
+ url: button.target!,
+ state: JSON.stringify(state),
+ // TODO: make these user-input-driven
+ castId: {
+ fid: 0,
+ hash: '0xthisisnotreal',
+ },
+ inputText,
fid: 0,
- hash: '0xthisisnotreal',
+ messageHash: '0xthisisnotreal',
+ network: 0,
+ timestamp: 0,
},
- inputText,
- fid: 0,
- messageHash: '0xthisisnotreal',
- network: 0,
- timestamp: 0,
- });
+ mockFrameOptions,
+ );
// TODO: handle when result is not defined
if (result) {
setResults((prev) => [...prev, result]);
@@ -140,7 +145,16 @@ function FrameButton({
openModal(onConfirm);
}
// TODO: implement other actions (mint, etc.)
- }, [button, index, inputText, openModal, setResults, state]);
+ }, [
+ button?.action,
+ button?.target,
+ index,
+ inputText,
+ mockFrameOptions,
+ openModal,
+ setResults,
+ state,
+ ]);
const buttonIcon = useMemo(() => {
switch (button?.action) {
@@ -169,3 +183,18 @@ function FrameButton({
);
}
+
+function MockFrameOptions() {
+ const [mockFrameOptions, setMockFrameOptions] = useAtom(mockFrameOptionsAtom);
+ const toggleFollowing = useCallback(() => {
+ setMockFrameOptions((prev) => ({ ...prev, following: !prev.following }));
+ }, [setMockFrameOptions]);
+ return (
+
+
+ Following{' '}
+
+
+
+ );
+}
diff --git a/framegear/utils/store.ts b/framegear/utils/store.ts
index edaa9a9dee..99ae46497c 100644
--- a/framegear/utils/store.ts
+++ b/framegear/utils/store.ts
@@ -1,6 +1,9 @@
import { atom } from 'jotai';
import { fetchFrame } from './fetchFrame';
+import { MockFrameRequestOptions } from '@coinbase/onchainkit';
// We store an array here so that we can step through history, e.g. seeing the
// chain of responses through a number of frame actions.
export const frameResultsAtom = atom>[]>([]);
+
+export const mockFrameOptionsAtom = atom({});