Links for embedding models elsewhere

packages/backend/.env

@@ -0,0 +1,3 @@
+DATABASE_URL=postgres://hamidahoderinwale@localhost:5432/catcolab
+FIREBASE_PROJECT_ID=catcolab-next
+

packages/backend/Cargo.toml

@@ -15,8 +15,9 @@ qubit = "0.10.2"
 regex = "1.11.1"
 serde = { version = "1.0.210", features = ["derive"] }
 serde_json = "1.0.128"
+shuttle-persist = "0.51.0"
 socketioxide = { version = "0.14.1", features = ["tracing"] }
-sqlx = { version = "0.8.2", features = ["runtime-tokio", "tls-native-tls", "postgres", "uuid", "json"] }
+sqlx = { version = "0.8.2", features = ["runtime-tokio", "tls-native-tls", "postgres", "uuid", "json", "macros"] }
 thiserror = "1.0.64"
 tokio = { version = "1.40.0", features = ["full"] }
 tower = { version = "0.5.1", features = ["util"] }

packages/backend/build.rs

@@ -0,0 +1,5 @@
+// generated by `sqlx migrate build-script`
+fn main() {
+    // trigger recompilation when a new migration is added
+    println!("cargo:rerun-if-changed=migrations");
+}

packages/backend/migration_status.txt

@@ -0,0 +1,4 @@
+20241004010448/installed document refs
+20241025030906/installed users
+20250114010822/installed test first five view
+20250121193606/installed testing

packages/backend/migrations/20250114010822_test_first_five_view.down.sql

@@ -0,0 +1,12 @@
+-- Add down migration script here
+SELECT *
+FROM users
+LIMIT 2;
+
+SELECT * 
+FROM permission_level
+LIMIT 2; 
+
+SELECT * 
+FROM permissions
+LIMIT 2; 

packages/backend/migrations/20250121193606_testing.down.sql

@@ -0,0 +1 @@
+DELETE FROM _sqlx_migrations WHERE version = '20250121193606';

packages/backend/migrations/20250121200530_testing.down.sql

@@ -0,0 +1 @@
+-- Add down migration script here

packages/backend/migrations/20250121200530_testing.up.sql

@@ -0,0 +1 @@
+-- Add up migration script here

packages/backend/src/search.rs

@@ -0,0 +1,14 @@
+use sqlx::PgPool;
+
+// adding indices to the table of models 
+
+pub fn 
+
+// take an enum for each instance of a model, subtyped based on the theory 
+
+pub enum modelInstance {
+    title, 
+    theory, 
+
+}
+// taking each title of model as keyword / tokenizing 

packages/backend/src/test.rs

@@ -0,0 +1,21 @@
+use sqlx::PgPool; // Import PgPool for PostgreSQL connection
+use std::env;
+
+#[tokio::main]
+async fn main() -> Result<(), sqlx::Error> {
+    // Set up the database connection pool
+    let database_url = env::var("DATABASE_URL").expect("DATABASE_URL must be set");
+    let pool = PgPool::connect(&database_url).await?;
+
+    // Execute the query and fetch results
+    let rows = sqlx::query("SELECT * FROM Catcolab LIMIT 5")
+        .fetch_all(&pool)
+        .await?;
+
+    // Print each row
+    for row in rows {
+        println!("{:?}", row);
+    }
+
+    Ok(())
+}

packages/frontend/src/model/model_editor.tsx

@@ -2,8 +2,12 @@ import { useParams } from "@solidjs/router";
 import { Match, Show, Switch, createResource, useContext } from "solid-js";
 import invariant from "tiny-invariant";
 
+import Dialog from "@corvu/dialog";
+import CodeXml from "lucide-solid/icons/code-xml";
+import { createMemo, createSignal } from "solid-js";
 import { useApi } from "../api";
 import { InlineInput } from "../components";
+import { IconButton } from "../components";
 import {
     type CellConstructor,
     type FormalCellEditorProps,
@@ -189,3 +193,61 @@ function judgmentLabel(judgment: ModelJudgment): string | undefined {
         return theory.modelMorTypeMeta(judgment.morType)?.name;
     }
 }
+
+export function EmbedButton() {
+    const [isOpen, setIsOpen] = createSignal(false);
+
+    return (
+        <>
+            <IconButton
+                onClick={() => setIsOpen(true)}
+                tooltip="Embed Notebook"
+                class="embed-button"
+            >
+                <CodeXml />
+                <p>Embed</p>
+            </IconButton>
+            <EmbedDialog isOpen={isOpen()} onClose={() => setIsOpen(false)} />
+        </>
+    );
+}
+
+function EmbedDialog(props: { isOpen: boolean; onClose: () => void }) {
+    const [copyStatus, setCopyStatus] = createSignal<"Copied!" | "Please try again later." | "">(
+        "",
+    );
+    const embedLink = createMemo(() => {
+        const pageURL = window.location.href;
+        return `<iframe src="${pageURL}" width="100%" height="500" frameborder="0"></iframe>`;
+    });
+
+    const copyToClipboard = async () => {
+        try {
+            await navigator.clipboard.writeText(embedLink());
+            setCopyStatus("Copied!");
+        } catch (err) {
+            setCopyStatus("Please try again later.");
+        }
+    };
+
+    return (
+        <Dialog open={props.isOpen} onOpenChange={props.onClose}>
+            <Dialog.Portal>
+                <Dialog.Overlay class="overlay" />
+                <Dialog.Content class="popup">
+                    <Dialog.Label>Embed Notebook</Dialog.Label>
+                    <Dialog.Description>Copy iframe Code Below:</Dialog.Description>
+                    <div class="embed-code-container">
+                        <code class="embed-code">{embedLink()}</code>
+                        <div class="copy-status">
+                            <button onClick={copyToClipboard} class="link-button">
+                                Copy
+                            </button>
+                            <span>{copyStatus()}</span>
+                        </div>
+                    </div>
+                </Dialog.Content>
+            </Dialog.Portal>
+        </Dialog>
+    );
+}

packages/frontend/src/page/menubar.css

@@ -15,3 +15,31 @@
         color: dimgray;
     }
 }
+
+.embed-code-container {
+    display: flex;
+    gap: 1rem;
+    align-items: flex-start;
+    margin: 1rem 0;
+}
+
+.embed-code {
+    display: block;
+    overflow-x: auto;
+    flex: 1;
+    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
+    background-color: #f5f5f5;
+    border: 1px solid #e0e0e0;
+    border-radius: 4px;
+    padding: 0.75rem;
+    font-size: 0.875rem;
+    line-height: 1.4;
+    color: #333;
+}
+
+.copy-status {
+    display: flex;
+    flex-direction: column;
+    line-height: 2em;
+    color: gray;
+}

packages/frontend/src/user/permissions.css

@@ -13,3 +13,16 @@
     align-items: center;
     gap: 5em;
 }
+
+.embed-button {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    margin: none;
+    border: none;
+    padding: none;
+    border-radius: 10%;
+    p {
+        font-family: var(--main-font);
+    }
+}

packages/frontend/src/user/permissions.tsx

@@ -16,6 +16,7 @@ import invariant from "tiny-invariant";
 import type { NewPermissions, PermissionLevel, Permissions, UserSummary } from "catcolab-api";
 import { useApi } from "../api";
 import { Dialog, FormGroup, IconButton, SelectItem, Warning } from "../components";
+import { EmbedButton } from "../model/model_editor";
 import { deepCopyJSON } from "../util/deepcopy";
 import { Login } from "./login";
 import { NameUser, UserInput } from "./username";
@@ -235,32 +236,34 @@ function AnonPermissionsButton() {
     };
 
     return (
-        <Dialog
-            open={open()}
-            onOpenChange={setOpen}
-            title="Permissions"
-            trigger={AnonPermissionsTrigger}
-        >
-            <p>
-                This document can be <strong>edited by anyone</strong> with the link.
-            </p>
-            <Switch>
-                <Match when={user.data}>
-                    <p>
-                        Create a new document to restrict permissions, <br /> or{" "}
-                        <a href="#" onClick={logOut}>
-                            log out
-                        </a>{" "}
-                        to create other anonymous documents.
-                    </p>
-                </Match>
-                <Match when={!user.loading}>
-                    <div class="separator" />
-                    <p>To create documents with restricted permissions, log in.</p>
-                    <Login onComplete={() => setOpen(false)} />
-                </Match>
-            </Switch>
-        </Dialog>
+        <>
+            <Dialog open={open()} onOpenChange={setOpen} title="" trigger={AnonPermissionsTrigger}>
+                <div class="embed-button">
+                    <h4>Permissions</h4>
+                    <EmbedButton />
+                </div>
+
+                <p>
+                    This document can be <strong>edited by anyone</strong> with the link.
+                </p>
+                <Switch>
+                    <Match when={user.data}>
+                        <p>
+                            Create a new document to restrict permissions, <br /> or{" "}
+                            <a href="#" onClick={logOut}>
+                                log out
+                            </a>{" "}
+                            to create other anonymous documents.
+                        </p>
+                    </Match>
+                    <Match when={!user.loading}>
+                        <div class="separator" />
+                        <p>To create documents with restricted permissions, log in.</p>
+                        <Login onComplete={() => setOpen(false)} />
+                    </Match>
+                </Switch>
+            </Dialog>
+        </>
     );
 }