farc - npm Package Compare versions

Comparing version 0.0.1-main.20240214T051845 to 0.0.1-main.20240214T165536

_lib/components/Button.d.ts

@@ -7,7 +7,6 @@ import type { HtmlEscapedString } from 'hono/utils/html';
 export type ButtonRootProps = ButtonProps & {
-    action?: 'post' | 'post_redirect';
     target?: string | undefined;
     value?: string | undefined;
 };
-export declare function ButtonRoot({ action, children, index, target, value, }: ButtonRootProps): HtmlEscapedString;
+export declare function ButtonRoot({ children, index, target, value, }: ButtonRootProps): HtmlEscapedString;
 export declare namespace ButtonRoot {
@@ -30,2 +29,10 @@ var __type: string;
 }
+export type ButtonRedirectProps = ButtonProps & {
+    location: string;
+    target?: string | undefined;
+};
+export declare function ButtonRedirect({ children, index, location, target, }: ButtonRedirectProps): HtmlEscapedString;
+export declare namespace ButtonRedirect {
+    var __type: string;
+}
 export type ButtonResetProps = ButtonProps;
@@ -39,4 +46,5 @@ export declare function ButtonReset({ children, index }: ButtonResetProps): JSX.Element;
     Mint: typeof ButtonMint;
+    Redirect: typeof ButtonRedirect;
     Reset: typeof ButtonReset;
 };
 //# sourceMappingURL=Button.d.ts.map

_lib/components/Button.js

 import { jsx as _jsx } from "farc/jsx/jsx-runtime";
 ButtonRoot.__type = 'button';
-export function ButtonRoot({ action = 'post', children, index = 0, target, value, }) {
+export function ButtonRoot({ children, index = 0, target, value, }) {
     return [
-        _jsx("meta", { property: `fc:frame:button:${index}`, content: children, "data-value": value }),
-        action !== 'post' && (_jsx("meta", { property: `fc:frame:button:${index}:action`, content: action })),
+        _jsx("meta", { property: `fc:frame:button:${index}`, content: children, ...(value ? { 'data-value': value } : {}) }),
+        _jsx("meta", { property: `fc:frame:button:${index}:action`, content: "post" }),
         target && (_jsx("meta", { property: `fc:frame:button:${index}:target`, content: target })),
@@ -13,3 +13,3 @@ ];
     return [
-        _jsx("meta", { property: `fc:frame:button:${index}`, content: children, "data-href": href }),
+        _jsx("meta", { property: `fc:frame:button:${index}`, content: children }),
         _jsx("meta", { property: `fc:frame:button:${index}:action`, content: "link" }),
@@ -22,3 +22,3 @@ _jsx("meta", { property: `fc:frame:button:${index}:target`, content: href }),
     return [
-        _jsx("meta", { property: `fc:frame:button:${index}`, content: children, "data-target": target }),
+        _jsx("meta", { property: `fc:frame:button:${index}`, content: children }),
         _jsx("meta", { property: `fc:frame:button:${index}:action`, content: "mint" }),
@@ -28,2 +28,10 @@ _jsx("meta", { property: `fc:frame:button:${index}:target`, content: target }),
 }
+ButtonRedirect.__type = 'button';
+export function ButtonRedirect({ children, index = 0, location, target, }) {
+    return [
+        _jsx("meta", { property: `fc:frame:button:${index}`, content: children, "data-type": "redirect", "data-value": location }),
+        _jsx("meta", { property: `fc:frame:button:${index}:action`, content: "post_redirect" }),
+        target && (_jsx("meta", { property: `fc:frame:button:${index}:target`, content: target })),
+    ];
+}
 ButtonReset.__type = 'button';
@@ -36,4 +44,5 @@ export function ButtonReset({ children, index = 0 }) {
     Mint: ButtonMint,
+    Redirect: ButtonRedirect,
     Reset: ButtonReset,
 });
 //# sourceMappingURL=Button.js.map

_lib/dev/components.js

@@ -46,2 +46,3 @@ import { jsx as _jsx, jsxs as _jsxs } from "farc/jsx/jsx-runtime";
       target: ${target ? `'${target}'` : undefined},
+      url: ${type === 'link' && target ? `'${target}'` : undefined},
     }`,
@@ -51,3 +52,3 @@ };
         '@keyup.escape': 'open = false',
-        'x-trap.noscroll': 'open', children: [_jsx("h1", { class: "font-bold text-base", children: "Leaving Warpcast" }), _jsx("div", { class: "text-fg2 text-sm font-mono", children: target }), _jsx("p", { class: "text-base leading-snug", children: "If you connect your wallet and the site is malicious, you may lose funds." }), _jsxs("div", { class: "flex gap-1.5 mt-1", children: [_jsx("button", { class: "bg-bg border rounded-md w-full text-sm font-bold py-1", type: "button", "x-on:click": "open = false", children: _jsx("div", { style: { marginTop: '1px' }, children: "Cancel" }) }), _jsx("button", { class: "bg-er border-er rounded-md w-full text-sm text-white font-bold py-1", target: "_blank", type: "button", "x-on:click": `open = false; window.open(target, '_blank');`, children: _jsx("div", { style: { marginTop: '1px' }, children: "I Understand" }) })] })] }));
+        'x-trap': 'open', children: [_jsx("h1", { class: "font-bold text-base", children: "Leaving Warpcast" }), _jsx("div", { class: "line-clamp-2 text-fg2 text-sm font-mono", "x-text": "url" }), _jsx("p", { class: "text-base leading-snug", children: "If you connect your wallet and the site is malicious, you may lose funds." }), _jsxs("div", { class: "flex gap-1.5 mt-1", children: [_jsx("button", { class: "bg-bg border rounded-md w-full text-sm font-bold py-1", type: "button", "x-on:click": "open = false", children: _jsx("div", { style: { marginTop: '1px' }, children: "Cancel" }) }), _jsx("button", { class: "bg-er border-er rounded-md w-full text-sm text-white font-bold py-1", target: "_blank", type: "button", "x-on:click": `open = false; window.open(url, '_blank');`, children: _jsx("div", { style: { marginTop: '1px' }, children: "I Understand" }) })] })] }));
     if (type === 'link')
@@ -57,2 +58,3 @@ return (_jsxs("div", { ...leavingAppContainerProps, children: [_jsxs("button", { class: buttonClass, type: "button", "x-on:click": "open = true", children: [_jsx("div", { style: { marginTop: '2px' }, children: innerHtml }), _jsx("div", { style: { marginTop: '2px' }, children: linkIcon })] }), leavingAppPrompt] }));
         return (_jsxs("div", { ...leavingAppContainerProps, children: [_jsxs("button", { class: buttonClass, type: "button", "x-on:click": `
+            if (open) return
             fetch(baseUrl + '/dev/redirect', {
@@ -69,8 +71,10 @@ method: 'POST',
             })
-            .then(res => {
-              console.log(res)
-              target = 'https://example.com'
+            .then(async (res) => {
+              const json = await res.json()
+              // TODO: show error
+              if (!json.success) return
+              url = json.redirectUrl
               open = true
             })
-            .catch(error => console.log(error))
+            .catch((error) => console.log(error))
           `, children: [_jsx("div", { style: { marginTop: '2px' }, children: innerHtml }), _jsx("div", { style: { marginTop: '2px' }, children: redirectIcon })] }), leavingAppPrompt] }));
@@ -365,2 +369,9 @@ return (_jsxs("button", { name: name, class: buttonClass, style: { paddingTop: '0.625rem ' }, type: "submit", value: index, children: [type === 'mint' && mintIcon, innerHtml] }));
     }
+
+    .line-clamp-2 {
+      overflow: hidden;
+      display: -webkit-box;
+      -webkit-box-orient: vertical;
+      -webkit-line-clamp: 2;
+    }
   `;
@@ -367,0 +378,0 @@ return _jsx("style", { dangerouslySetInnerHTML: { __html: styles } });

_lib/dev/routes.js

@@ -96,3 +96,2 @@ import { jsxs as _jsxs, jsx as _jsx } from "farc/jsx/jsx-runtime";
         });
-        console.log(postUrl);
         const response = await fetch(postUrl, {
@@ -121,10 +120,7 @@ method: 'POST',
         });
-        // TODO: Get redirect url
-        console.log({ response });
-        return c.json({
-            success: true,
-            redirectUrl: '/',
-        });
+        if (!response.redirected)
+            return c.json({ success: false });
+        return c.json({ success: true, redirectUrl: response.url });
     });
 }
 //# sourceMappingURL=routes.js.map

_lib/farc-base.js

@@ -78,2 +78,8 @@ var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
             });
+            if (context.status === 'redirect') {
+                const location = context.buttonValue;
+                if (!location)
+                    throw new Error('location required to redirect');
+                return c.redirect(location, 302);
+            }
             if (context.url !== parsePath(c.req.url))
@@ -80,0 +86,0 @@ return c.redirect(`${context.url}?previousContext=${query.previousContext}`);

_lib/types.d.ts

@@ -14,5 +14,6 @@ import { type Context, type Env } from 'hono';
      * - `initial` - The frame has not yet been interacted with.
+     * - `redirect` - The frame interaction is a redirect (button of type `'post_redirect'`).
      * - `response` - The frame has been interacted with (user presses button).
      */
-    status: 'initial' | 'response';
+    status: 'initial' | 'redirect' | 'response';
     trustedData?: TrustedData | undefined;
@@ -19,0 +20,0 @@ untrustedData?: UntrustedData | undefined;

_lib/utils/getFrameContext.js

@@ -8,6 +8,8 @@ import { produce } from 'immer';
     const { trustedData, untrustedData } = context || {};
-    const { buttonIndex, buttonValue, inputText, reset } = getIntentState(
+    const { buttonIndex, buttonValue, inputText, redirect, reset } = getIntentState(
     // TODO: derive from untrusted data.
     untrustedData, previousContext?.intents || []);
     const status = (() => {
+        if (redirect)
+            return 'redirect';
         if (reset)
@@ -14,0 +16,0 @@ return 'initial';

_lib/utils/getIntentState.d.ts

@@ -7,4 +7,5 @@ import { type JSXNode } from 'hono/jsx';
     inputText: string | undefined;
+    redirect: boolean;
     reset: boolean;
 };
 //# sourceMappingURL=getIntentState.d.ts.map

_lib/utils/getIntentState.js

@@ -5,3 +5,9 @@ import {} from 'hono/jsx';
     const { buttonIndex, inputText } = frameData || {};
-    const state = { buttonIndex, buttonValue: undefined, inputText, reset: false };
+    const state = {
+        buttonIndex,
+        buttonValue: undefined,
+        inputText,
+        redirect: false,
+        reset: false,
+    };
     if (!intents)
@@ -12,5 +18,9 @@ return state;
         const intent = buttonIntents[buttonIndex - 1];
-        state.buttonValue = intent.props['data-value'];
-        if (intent.props['data-type'] === 'reset')
+        const type = intent.props['data-type'];
+        if (type === 'redirect')
+            state.redirect = true;
+        else if (type === 'reset')
             state.reset = true;
+        const value = intent.props['data-value'];
+        state.buttonValue = value;
     }
@@ -17,0 +27,0 @@ return state;

package.json

 {
   "name": "farc",
-  "version": "0.0.1-main.20240214T051845",
+  "version": "0.0.1-main.20240214T165536",
   "type": "module",
@@ -5,0 +5,0 @@ "module": "_lib/index.js",

types.ts

@@ -17,5 +17,6 @@ // TODO: TSDoc
    * - `initial` - The frame has not yet been interacted with.
+   * - `redirect` - The frame interaction is a redirect (button of type `'post_redirect'`).
    * - `response` - The frame has been interacted with (user presses button).
    */
-  status: 'initial' | 'response'
+  status: 'initial' | 'redirect' | 'response'
   trustedData?: TrustedData | undefined
@@ -22,0 +23,0 @@ untrustedData?: UntrustedData | undefined

utils/getFrameContext.ts

@@ -23,9 +23,11 @@ import type { Context } from 'hono'
 
-  const { buttonIndex, buttonValue, inputText, reset } = getIntentState(
-    // TODO: derive from untrusted data.
-    untrustedData,
-    previousContext?.intents || [],
-  )
+  const { buttonIndex, buttonValue, inputText, redirect, reset } =
+    getIntentState(
+      // TODO: derive from untrusted data.
+      untrustedData,
+      previousContext?.intents || [],
+    )
 
   const status = (() => {
+    if (redirect) return 'redirect'
     if (reset) return 'initial'
@@ -32,0 +34,0 @@ return context.status || 'initial'

utils/getIntentState.ts

@@ -10,4 +10,12 @@ import { type JSXNode } from 'hono/jsx'
   const { buttonIndex, inputText } = frameData || {}
-  const state = { buttonIndex, buttonValue: undefined, inputText, reset: false }
+
+  const state = {
+    buttonIndex,
+    buttonValue: undefined,
+    inputText,
+    redirect: false,
+    reset: false,
+  }
   if (!intents) return state
+
   if (buttonIndex) {
@@ -18,6 +26,12 @@ const buttonIntents = intents.filter((intent) =>
     const intent = buttonIntents[buttonIndex - 1]
-    state.buttonValue = intent.props['data-value']
-    if (intent.props['data-type'] === 'reset') state.reset = true
+
+    const type = intent.props['data-type']
+    if (type === 'redirect') state.redirect = true
+    else if (type === 'reset') state.reset = true
+
+    const value = intent.props['data-value']
+    state.buttonValue = value
   }
+
   return state
 }

No alert changes

Improved metrics

Total package byte prevSize

356481

increased by1.15%

Lines of code

3429

increased by2.42%

No dependency changes