jac-client 0.2.10__py3-none-any.whl → 0.2.12__py3-none-any.whl

jac_client/examples/little-x/main.jac

@@ -9,27 +9,27 @@ node Profile {
 
     can update with update_profile entry {
         self.username = visitor.new_username;
-        report self ;
+        report self;
     }
 
     can get with get_profile entry {
         follwers = [
             {"id": jid(i), "username": i.username} for i in [self-->(`?Profile)]
         ];
-        report {"user": self, "followers": follwers} ;
+        report {"user": self, "followers": follwers};
     }
 
     can follow with follow_request entry {
         current_profile = [root-->(`?Profile)];
         current_profile[0] +>: Follow() :+> self;
-        report self ;
+        report self;
     }
 
     can un_follow with un_follow_request entry {
         current_profile = [root-->(`?Profile)];
         follow_edge = [edge current_profile[0]->:Follow:->self];
-        del follow_edge[0] ;
-        report self ;
+        del follow_edge[0];
+        report self;
     }
 }
 
@@ -49,25 +49,25 @@ node Tweet {
 
     can update with update_tweet exit {
         self.content = visitor.updated_content;
-        report self ;
+        report self;
     }
 
     can delete with remove_tweet exit {
-        del self ;
+        del self;
         disengage;
     }
 
     can like_tweet with like_tweet entry {
         current_profile = [root-->(`?Profile)];
         self +>: Like() :+> current_profile[0];
-        report self ;
+        report self;
     }
 
     can remove_like with remove_like entry {
         current_profile = [root-->(`?Profile)];
         like_edge = [edge self->:Like:->current_profile[0]];
-        del like_edge[0] ;
-        report self ;
+        del like_edge[0];
+        report self;
     }
 
     can comment with comment_tweet entry {
@@ -77,7 +77,7 @@ node Tweet {
         );
         grant(comment_node[0], level=ConnectPerm);
         self ++> comment_node[0];
-        report comment_node[0] ;
+        report comment_node[0];
     }
 
     def get_info -> TweetInfo {
@@ -108,11 +108,11 @@ node Comment {
 
     can update with update_comment entry {
         self.content = visitor.updated_content;
-        report self ;
+        report self;
     }
 
     can delete with remove_comment entry {
-        del self ;
+        del self;
         disengage;
     }
 }
@@ -149,7 +149,7 @@ walker load_user_profiles {
     }
 
     can report_profiles with exit {
-        report self.profiles ;
+        report self.profiles;
     }
 }
 
@@ -163,7 +163,7 @@ walker create_tweet(visit_profile) {
     can tweet with Profile entry {
         tweet_node = here +>: Post() :+> Tweet(content=self.content, embedding=[]);
         grant(tweet_node[0], level=ConnectPerm);
-        report tweet_node ;
+        report tweet_node;
     }
 }
 
@@ -199,7 +199,7 @@ walker load_feed(visit_profile) {
     }
 
     can report_feed with exit {
-        report self.results ;
+        report self.results;
     }
 }
 
@@ -224,44 +224,37 @@ cl obj ClientProfile {
 
 # UI Components - Render a single tweet card
 cl def TweetCard(tweet: ClientTweet) -> any {
-    return <div
-        class="tweet-card"
-        style={{
-            "border": "1px solid #e1e8ed",
-            "padding": "15px",
-            "margin": "10px 0",
-            "borderRadius": "8px"
-        }}
-    >
+    return
         <div
-            class="tweet-header"
-            style={{"fontWeight": "bold", "marginBottom": "80px"}}
-        >
-            @{tweet.username}
-        </div>
-        <div
-            class="tweet-content"
-            style={{"marginBottom": "12px"}}
-        >
-            {tweet.content}
-        </div>
-        <div
-            class="tweet-actions"
-            style={{"display": "flex", "gap": "15px"}}
+            class="tweet-card"
+            style={{
+                "border": "1px solid #e1e8ed",
+                "padding": "15px",
+                "margin": "10px 0",
+                "borderRadius": "8px"
+            }}
         >
-            <button
-                onclick={like_tweet_action(tweet.id)}
-                style={{"padding": "5px 10px", "cursor": "pointer"}}
-            >
-                Like ({tweet.likes.length})
-            </button>
-            <button
-                style={{"padding": "5px 10px"}}
+            <div
+                class="tweet-header"
+                style={{"fontWeight": "bold", "marginBottom": "80px"}}
             >
-                Comment ({tweet.comments.length})
-            </button>
-        </div>
-    </div>;
+                @{tweet.username}
+            </div>
+            <div class="tweet-content" style={{"marginBottom": "12px"}}>
+                {tweet.content}
+            </div>
+            <div class="tweet-actions" style={{"display": "flex", "gap": "15px"}}>
+                <button
+                    onclick={like_tweet_action(tweet.id)}
+                    style={{"padding": "5px 10px", "cursor": "pointer"}}
+                >
+                    Like ({tweet.likes.length})
+                </button>
+                <button style={{"padding": "5px 10px"}}>
+                    Comment ({tweet.comments.length})
+                </button>
+            </div>
+        </div>;
 }
 
 # Handle liking a tweet - calls server walker directly
@@ -281,24 +274,27 @@ cl async def like_tweet_action(
 
 # Render the main feed view
 cl def FeedView(tweets: list) -> any {
-    return <div
-        class="feed-container"
-        style={{"maxWidth": "600px", "margin": "0 auto", "fontFamily": "sans-serif"}}
-    >
+    return
         <div
-            class="feed-header"
-            style={{"padding": "20px", "borderBottom": "1px solid #e1e8ed"}}
+            class="feed-container"
+            style={{
+                "maxWidth": "600px",
+                "margin": "0 auto",
+                "fontFamily": "sans-serif"
+            }}
         >
-            <h1
-                style={{"margin": "0"}}
+            <div
+                class="feed-header"
+                style={{"padding": "20px", "borderBottom": "1px solid #e1e8ed"}}
             >
-                LittleX Feed
-            </h1>
-        </div>
-        <div class="feed-content">
-            {[TweetCard(tweet) for tweet in tweets]}
-        </div>
-    </div>;
+                <h1 style={{"margin": "0"}}>
+                    LittleX Feed
+                </h1>
+            </div>
+            <div class="feed-content">
+                {[TweetCard(tweet) for tweet in tweets]}
+            </div>
+        </div>;
 }
 
 # Render login form
@@ -306,100 +302,74 @@ cl def LoginForm -> any {
     suggestions = ['good luck', 'have fun', 'enjoy the ride'];
     randomSuggestion = _.sample(suggestions);
     result = "Good luck with your journey!";
-    return <Card
-        title="Login to LittleX"
-        style={{"maxWidth": "400px", "margin": "50px auto"}}
-    >
-        <Card.Meta
-            title={randomSuggestion}
-            description={result}
-        />
-        <form
-            onSubmit={handle_login}
+    return
+        <Card
+            title="Login to LittleX"
+            style={{"maxWidth": "400px", "margin": "50px auto"}}
         >
-            <div
-                style={{"marginBottom": "15px"}}
-            >
-                <label
-                    style={{"display": "block", "marginBottom": "5px"}}
-                >
-                    Username:
-                </label>
-                <input
-                    type="text"
-                    id="username"
+            <Card.Meta title={randomSuggestion} description={result} />
+            <form onSubmit={handle_login}>
+                <div style={{"marginBottom": "15px"}}>
+                    <label style={{"display": "block", "marginBottom": "5px"}}>
+                        Username:
+                    </label>
+                    <input
+                        type="text"
+                        id="username"
+                        style={{
+                            "width": "100%",
+                            "padding": "8px",
+                            "boxSizing": "border-box"
+                        }}
+                    />
+                </div>
+                <div style={{"marginBottom": "15px"}}>
+                    <label style={{"display": "block", "marginBottom": "5px"}}>
+                        Password:
+                    </label>
+                    <input
+                        type="password"
+                        id="password"
+                        style={{
+                            "width": "100%",
+                            "padding": "8px",
+                            "boxSizing": "border-box"
+                        }}
+                    />
+                </div>
+                <Button
+                    htmlType="submit"
                     style={{
                         "width": "100%",
-                        "padding": "8px",
-                        "boxSizing": "border-box"
+                        "padding": "10px",
+                        "backgroundColor": "#1da1f2",
+                        "color": "white",
+                        "border": "none",
+                        "borderRadius": "4px",
+                        "cursor": "pointer"
                     }}
-                />
-            </div>
-            <div
-                style={{"marginBottom": "15px"}}
-            >
-                <label
-                    style={{"display": "block", "marginBottom": "5px"}}
                 >
-                    Password:
-                </label>
-                <input
-                    type="password"
-                    id="password"
-                    style={{
-                        "width": "100%",
-                        "padding": "8px",
-                        "boxSizing": "border-box"
-                    }}
-                />
+                    Login
+                </Button>
+                <Button color="default" variant="dashed">
+                    Dashed
+                </Button>
+                <Button color="default" variant="filled">
+                    Filled
+                </Button>
+                <Button color="default" variant="text">
+                    Text
+                </Button>
+                <Button color="default" variant="link">
+                    Link
+                </Button>
+            </form>
+            <div style={{"marginTop": "15px", "textAlign": "center"}}>
+                <Link href="/signup">
+                    Don't have an account? Sign up
+                </Link>
             </div>
-            <Button
-                htmlType="submit"
-                style={{
-                    "width": "100%",
-                    "padding": "10px",
-                    "backgroundColor": "#1da1f2",
-                    "color": "white",
-                    "border": "none",
-                    "borderRadius": "4px",
-                    "cursor": "pointer"
-                }}
-            >
-                Login
-            </Button>
-            <Button
-                color="default"
-                variant="dashed"
-            >
-                Dashed
-            </Button>
-            <Button
-                color="default"
-                variant="filled"
-            >
-                Filled
-            </Button>
-            <Button
-                color="default"
-                variant="text"
-            >
-                Text
-            </Button>
-            <Button
-                color="default"
-                variant="link"
-            >
-                Link
-            </Button>
-        </form>
-        <div
-            style={{"marginTop": "15px", "textAlign": "center"}}
-        >
-            <Link href="/signup">
-                Don't have an account? Sign up
-            </Link>
-        </div>
-    </Card>;
+        </Card>;
 }
 
 # Handle login form submission
@@ -417,106 +387,88 @@ cl async def handle_login(event: any) -> None {
 
 # Render signup form
 cl def SignupForm -> any {
-    return <div
-        class="signup-container"
-        style={{
-            "maxWidth": "400px",
-            "margin": "50px auto",
-            "padding": "20px",
-            "border": "1px solid #e1e8ed",
-            "borderRadius": "8px",
-            "fontFamily": "sans-serif"
-        }}
-    >
-        <Typography.Title
-            level={2}
-            style={{"marginTop": "0"}}
-        >
-            Sign Up for LittleX
-        </Typography.Title>
-        <form
-            onSubmit={handle_signup}
+    return
+        <div
+            class="signup-container"
+            style={{
+                "maxWidth": "400px",
+                "margin": "50px auto",
+                "padding": "20px",
+                "border": "1px solid #e1e8ed",
+                "borderRadius": "8px",
+                "fontFamily": "sans-serif"
+            }}
         >
-            <div
-                style={{"marginBottom": "15px"}}
-            >
-                <label
-                    style={{"display": "block", "marginBottom": "5px"}}
-                >
-                    Username:
-                </label>
-                <input
-                    type="text"
-                    id="signup-username"
-                    required
+            <Typography.Title level={2} style={{"marginTop": "0"}}>
+                Sign Up for LittleX
+            </Typography.Title>
+            <form onSubmit={handle_signup}>
+                <div style={{"marginBottom": "15px"}}>
+                    <label style={{"display": "block", "marginBottom": "5px"}}>
+                        Username:
+                    </label>
+                    <input
+                        type="text"
+                        id="signup-username"
+                        required
+                        style={{
+                            "width": "100%",
+                            "padding": "8px",
+                            "boxSizing": "border-box"
+                        }}
+                    />
+                </div>
+                <div style={{"marginBottom": "15px"}}>
+                    <label style={{"display": "block", "marginBottom": "5px"}}>
+                        Password:
+                    </label>
+                    <input
+                        type="password"
+                        id="signup-password"
+                        required
+                        style={{
+                            "width": "100%",
+                            "padding": "8px",
+                            "boxSizing": "border-box"
+                        }}
+                    />
+                </div>
+                <div style={{"marginBottom": "15px"}}>
+                    <label style={{"display": "block", "marginBottom": "5px"}}>
+                        Confirm Password:
+                    </label>
+                    <input
+                        type="password"
+                        id="signup-password-confirm"
+                        required
+                        style={{
+                            "width": "100%",
+                            "padding": "8px",
+                            "boxSizing": "border-box"
+                        }}
+                    />
+                </div>
+                <button
+                    type="submit"
                     style={{
                         "width": "100%",
-                        "padding": "8px",
-                        "boxSizing": "border-box"
-                    }}
-                />
-            </div>
-            <div
-                style={{"marginBottom": "15px"}}
-            >
-                <label
-                    style={{"display": "block", "marginBottom": "5px"}}
-                >
-                    Password:
-                </label>
-                <input
-                    type="password"
-                    id="signup-password"
-                    required
-                    style={{
-                        "width": "100%",
-                        "padding": "8px",
-                        "boxSizing": "border-box"
+                        "padding": "10px",
+                        "backgroundColor": "#1da1f2",
+                        "color": "white",
+                        "border": "none",
+                        "borderRadius": "4px",
+                        "cursor": "pointer"
                     }}
-                />
-            </div>
-            <div
-                style={{"marginBottom": "15px"}}
-            >
-                <label
-                    style={{"display": "block", "marginBottom": "5px"}}
                 >
-                    Confirm Password:
-                </label>
-                <input
-                    type="password"
-                    id="signup-password-confirm"
-                    required
-                    style={{
-                        "width": "100%",
-                        "padding": "8px",
-                        "boxSizing": "border-box"
-                    }}
-                />
+                    Sign Up
+                </button>
+            </form>
+            <div style={{"marginTop": "15px", "textAlign": "center"}}>
+                <Link href="/login">
+                    Already have an account? Login
+                </Link>
             </div>
-            <button
-                type="submit"
-                style={{
-                    "width": "100%",
-                    "padding": "10px",
-                    "backgroundColor": "#1da1f2",
-                    "color": "white",
-                    "border": "none",
-                    "borderRadius": "4px",
-                    "cursor": "pointer"
-                }}
-            >
-                Sign Up
-            </button>
-        </form>
-        <div
-            style={{"marginTop": "15px", "textAlign": "center"}}
-        >
-            <Link href="/login">
-                Already have an account? Login
-            </Link>
-        </div>
-    </div>;
+        </div>;
 }
 
 # Navigation helper functions removed - using Link component and navigate() directly
@@ -561,22 +513,22 @@ cl def:pub App -> any {
     # Create routes array manually (workaround for JS compiler bug with named args)
     login_route = {
         "path": "/login",
-        "component": lambda   -> any{ return LoginForm(); } ,
+        "component": lambda -> any { return LoginForm(); },
         "guard": None
     };
     signup_route = {
         "path": "/signup",
-        "component": lambda   -> any{ return SignupForm(); } ,
+        "component": lambda -> any { return SignupForm(); },
         "guard": None
     };
     home_route = {
         "path": "/home",
-        "component": lambda   -> any{ return HomeView(); } ,
+        "component": lambda -> any { return HomeView(); },
         "guard": jacIsLoggedIn
     };
     profile_route = {
         "path": "/profile",
-        "component": lambda   -> any{ return ProfileView(); } ,
+        "component": lambda -> any { return ProfileView(); },
         "guard": jacIsLoggedIn
     };
 
@@ -586,15 +538,16 @@ cl def:pub App -> any {
     # Get current path for navbar
     currentPath = router.path();
 
-    return <div class="app-container">
-        {build_nav_bar(currentPath)}
-        <Rotate>
-            <span>
-                😂
-            </span>
-        </Rotate>
-        {router.render()}
-    </div>;
+    return
+        <div class="app-container">
+            {build_nav_bar(currentPath)}
+            <Rotate>
+                <span>
+                    😂
+                </span>
+            </Rotate>
+            {router.render()}
+        </div>;
 }
 
 # Helper to build navigation bar
@@ -602,115 +555,124 @@ cl def build_nav_bar(route: str) -> any {
     if not jacIsLoggedIn() or route == "/login" or route == "/signup" {
         return None;
     }
-    return <nav
-        style={{
-            "backgroundColor": "#1da1f2",
-            "padding": "15px",
-            "marginBottom": "20px"
-        }}
-    >
-        <div
+    return
+        <nav
             style={{
-                "maxWidth": "600px",
-                "margin": "0 auto",
-                "display": "flex",
-                "gap": "20px",
-                "alignItems": "center"
+                "backgroundColor": "#1da1f2",
+                "padding": "15px",
+                "marginBottom": "20px"
             }}
         >
-            <Link href="/home">
-                <span
+            <div
+                style={{
+                    "maxWidth": "600px",
+                    "margin": "0 auto",
+                    "display": "flex",
+                    "gap": "20px",
+                    "alignItems": "center"
+                }}
+            >
+                <Link href="/home">
+                    <span
+                        style={{
+                            "color": "white",
+                            "textDecoration": "none",
+                            "fontWeight": "bold"
+                        }}
+                    >
+                        Home
+                    </span>
+                </Link>
+                <Link href="/profile">
+                    <span
+                        style={{
+                            "color": "white",
+                            "textDecoration": "none",
+                            "fontWeight": "bold"
+                        }}
+                    >
+                        Profile
+                    </span>
+                </Link>
+                <button
+                    onClick={logout_action}
                     style={{
-                        "color": "white",
-                        "textDecoration": "none",
+                        "marginLeft": "auto",
+                        "padding": "5px 15px",
+                        "backgroundColor": "white",
+                        "color": "#1da1f2",
+                        "border": "none",
+                        "borderRadius": "4px",
+                        "cursor": "pointer",
                         "fontWeight": "bold"
                     }}
                 >
-                    Home
-                </span>
-            </Link>
-            <Link href="/profile">
-                <span
-                    style={{
-                        "color": "white",
-                        "textDecoration": "none",
-                        "fontWeight": "bold"
-                    }}
-                >
-                    Profile
-                </span>
-            </Link>
-            <button
-                onClick={logout_action}
-                style={{
-                    "marginLeft": "auto",
-                    "padding": "5px 15px",
-                    "backgroundColor": "white",
-                    "color": "#1da1f2",
-                    "border": "none",
-                    "borderRadius": "4px",
-                    "cursor": "pointer",
-                    "fontWeight": "bold"
-                }}
-            >
-                Logout
-            </button>
-        </div>
-    </nav>;
+                    Logout
+                </button>
+            </div>
+        </nav>;
 }
 
 # Home view - simplified for testing reactive routing
 cl def HomeView -> any {
     if not jacIsLoggedIn() {
         navigate("/login");
-        return <div></div>;
+        return
+            <div></div>;
     }
 
-    return <div
-        style={{"textAlign": "center", "padding": "50px", "fontFamily": "sans-serif"}}
-    >
-        <h1>
-            Home Feed
-        </h1>
-        <p>
-            Welcome to LittleX! This is the home page.
-        </p>
-        <p>
-            The reactive router is working!
-        </p>
-    </div>;
+    return
+        <div
+            style={{
+                "textAlign": "center",
+                "padding": "50px",
+                "fontFamily": "sans-serif"
+            }}
+        >
+            <h1>
+                Home Feed
+            </h1>
+            <p>
+                Welcome to LittleX! This is the home page.
+            </p>
+            <p>
+                The reactive router is working!
+            </p>
+        </div>;
 }
 
 # Profile view
 cl def ProfileView -> any {
     if not jacIsLoggedIn() {
         navigate("/login");
-        return <div></div>;
+        return
+            <div></div>;
     }
-    return <div
-        class="profile-container"
-        style={{
-            "maxWidth": "600px",
-            "margin": "20px auto",
-            "padding": "20px",
-            "fontFamily": "sans-serif"
-        }}
-    >
-        <h1>
-            Profile
-        </h1>
+    return
         <div
+            class="profile-container"
             style={{
-                "padding": "15px",
-                "border": "1px solid #e1e8ed",
-                "borderRadius": "8px"
+                "maxWidth": "600px",
+                "margin": "20px auto",
+                "padding": "20px",
+                "fontFamily": "sans-serif"
             }}
         >
-            <p>
-                Profile information will be displayed here.
-            </p>
-        </div>
-    </div>;
+            <h1>
+                Profile
+            </h1>
+            <div
+                style={{
+                    "padding": "15px",
+                    "border": "1px solid #e1e8ed",
+                    "borderRadius": "8px"
+                }}
+            >
+                <p>
+                    Profile information will be displayed here.
+                </p>
+            </div>
+        </div>;
 }
 
 # Main SPA entry point - simplified with reactive routing