diff --git a/apps/extension/README.md b/apps/extension/README.md
new file mode 100644
index 00000000..d5aceb2c
--- /dev/null
+++ b/apps/extension/README.md
@@ -0,0 +1,37 @@
+# [projectName]
+
+> This project was bootstrapped using the Extension.js React-TypeScript template.
+
+## Scripts Available
+
+In the project directory, you can run:
+
+### [projectPackageManager] dev
+
+```
+// Runs the app in the development mode.
+// Will open a new browser instance with your extension loaded.
+// The page will reload when you make changes.
+[projectPackageManager] dev
+```
+
+### [projectPackageManager] start
+
+```
+// Runs the app in the production mode.
+// Will open a new browser instance with your extension loaded.
+// This is how your browser extension will work once published.
+[projectPackageManager] start
+```
+
+### [projectPackageManager] build
+
+```
+// Builds the app for production.
+// Bundles your browser extension in production mode for the target browser.
+[projectPackageManager] run build
+```
+
+## Learn More
+
+You can learn more in the [Extension.js](https://extension.js.org) documentation.
diff --git a/apps/extension/background.ts b/apps/extension/background.ts
new file mode 100644
index 00000000..8f3162fc
--- /dev/null
+++ b/apps/extension/background.ts
@@ -0,0 +1,25 @@
+chrome.runtime.onInstalled.addListener(function () {
+ let context = 'selection';
+ let title = "Supermemory - Save Highlight";
+ chrome.contextMenus.create({
+ title: title,
+ contexts: ['selection'],
+ id: context,
+ });
+});
+
+chrome.contextMenus.onClicked.addListener(function (info, tab) {
+if (info.menuItemId === 'selection') {
+ // you can add a link to a cf worker or whatever u want
+ // fetch("", {
+ // method: "POST",
+ // headers: { "Content-Type": "application/json" },
+ // body: JSON.stringify({
+ // data: info.selectionText,
+ // }),
+ // });
+
+ //so you first save it and then send the reponse to the screen
+ chrome.tabs.sendMessage(tab?.id || 1, info.selectionText);
+}
+});
\ No newline at end of file
diff --git a/apps/extension/content/ContentApp.tsx b/apps/extension/content/ContentApp.tsx
new file mode 100644
index 00000000..b8cb6710
--- /dev/null
+++ b/apps/extension/content/ContentApp.tsx
@@ -0,0 +1,45 @@
+import React, { useEffect } from "react";
+
+export default function ContentApp() {
+ const [text, setText] = React.useState("");
+ const [hover, setHover] = React.useState(false);
+
+ useEffect(() => {
+ const messageListener = (message: any) => {
+ setText(message);
+ setTimeout(() => setText(""), 2000);
+ };
+ chrome.runtime.onMessage.addListener(messageListener);
+
+ document.addEventListener('mousemove', (e)=> {
+ const percentageX = (e.clientX / window.innerWidth) * 100;
+ const percentageY = (e.clientY / window.innerHeight) * 100;
+
+ if (percentageX > 75 && percentageY > 75){
+ setHover(true)
+ } else {
+ setHover(false)
+ }
+ })
+ return () => {
+ chrome.runtime.onMessage.removeListener(messageListener);
+ };
+ }, []);
+
+ return (
+
+
+
+
+
+
+
Saved!
+
{text}
+
+
+ );
+}
\ No newline at end of file
diff --git a/apps/extension/content/base.css b/apps/extension/content/base.css
new file mode 100644
index 00000000..bd6213e1
--- /dev/null
+++ b/apps/extension/content/base.css
@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
\ No newline at end of file
diff --git a/apps/extension/content/content.css b/apps/extension/content/content.css
new file mode 100644
index 00000000..b8195ee8
--- /dev/null
+++ b/apps/extension/content/content.css
@@ -0,0 +1,6 @@
+#extension-root {
+ position: fixed;
+ bottom: 0;
+ right: 0;
+ z-index: 99999;
+}
diff --git a/apps/extension/content/content.tsx b/apps/extension/content/content.tsx
new file mode 100644
index 00000000..65c62d74
--- /dev/null
+++ b/apps/extension/content/content.tsx
@@ -0,0 +1,15 @@
+import ReactDOM from 'react-dom/client'
+import ContentApp from './ContentApp'
+import('./base.css')
+import('./content.css')
+
+setTimeout(initial, 4000)
+
+function initial() {
+ const rootDiv = document.createElement('div')
+ rootDiv.id = 'extension-root'
+ document.body.appendChild(rootDiv)
+
+ const root = ReactDOM.createRoot(rootDiv)
+ root.render(<>)
+}
diff --git a/apps/extension/extension-env.d.ts b/apps/extension/extension-env.d.ts
new file mode 100644
index 00000000..7cadeab2
--- /dev/null
+++ b/apps/extension/extension-env.d.ts
@@ -0,0 +1,9 @@
+// Required Extension.js types for TypeScript projects.
+// This file is auto-generated and should not be excluded.
+// If you need extra types, consider creating a new *.d.ts and
+// referencing it in the "include" array in your tsconfig.json file.
+// See https://www.typescriptlang.org/tsconfig#include for info.
+///
+
+// Polyfill types for browser.* APIs.
+///
diff --git a/apps/extension/index.html b/apps/extension/index.html
new file mode 100644
index 00000000..bb4c07c7
--- /dev/null
+++ b/apps/extension/index.html
@@ -0,0 +1,11 @@
+
+
+
+
+
+ God Bless Vanilla JavaScript!!!
+
+
+
+
+
+ );
+}
+
+export default page;
+
+const content = [
+ {
+ content:
+ "Regional growth patterns diverge, with strong performance in the United States and several emerging markets, contrasted by weaker prospects in many advanced economies, particularly in Europe (World Economic Forum) (OECD). The rapid adoption of artificial intelligence (AI) is expected to drive productivity growth, especially in advanced economies, potentially mitigating labor shortages and boosting income levels in emerging markets (World Economic Forum) (OECD). However, ongoing geopolitical tensions and economic fragmentation are likely to maintain a level of uncertainty and volatility in the global economy (World Economic Forum.",
+ icon: AutocompleteIcon,
+ iconAlt: "Autocomplete",
+ extraInfo:
+ "Page Url: https://chatgpt.com/c/762cd44e-1752-495b-967a-aa3c23c6024a",
+ },
+ {
+ content:
+ "As of mid-2024, the global economy is experiencing modest growth with significant regional disparities. Global GDP growth is projected to be around 3.1% in 2024, rising slightly to 3.2% in 2025. This performance, although below the pre-pandemic average, reflects resilience despite various economic pressures, including tight monetary conditions and geopolitical tensions (IMF)(OECD) Inflation is moderating faster than expected, with global headline inflation projected to fall to 5.8% in 2024 and 4.4% in 2025, contributing to improving real incomes and positive trade growth (IMF) (OECD)",
+ icon: blockIcon,
+ iconAlt: "Autocomplete",
+ extraInfo:
+ "Page Url: https://www.cnbc.com/2024/05/23/nvidia-keeps-hitting-records-can-investors-still-buy-the-stock.html?&qsearchterm=nvidia",
+ },
+];
diff --git a/apps/web/app/(canvas)/canvas/page.tsx b/apps/web/app/(canvas)/canvas/page.tsx
index 533ed33c..3652ef04 100644
--- a/apps/web/app/(canvas)/canvas/page.tsx
+++ b/apps/web/app/(canvas)/canvas/page.tsx
@@ -1,125 +1,9 @@
-"use client";
-
-import { Canvas } from "../canvas";
-import React, { useState } from "react";
-import { Panel, PanelGroup, PanelResizeHandle } from "react-resizable-panels";
-import { SettingsIcon, DragIcon } from "@repo/ui/icons";
-import DraggableComponentsContainer from "@repo/ui/components/canvas/draggableComponent";
-import { AutocompleteIcon, blockIcon } from "@repo/ui/icons";
-import Image from "next/image";
-import { Switch } from "@repo/ui/shadcn/switch";
-import { Label } from "@repo/ui/shadcn/label";
+import React from 'react'
function page() {
- const [fullScreen, setFullScreen] = useState(false);
- const [visible, setVisible] = useState(true);
-
return (
-
-
-
- );
-}
-
-export default page;
-
-const content = [
- {
- content:
- "Regional growth patterns diverge, with strong performance in the United States and several emerging markets, contrasted by weaker prospects in many advanced economies, particularly in Europe (World Economic Forum) (OECD). The rapid adoption of artificial intelligence (AI) is expected to drive productivity growth, especially in advanced economies, potentially mitigating labor shortages and boosting income levels in emerging markets (World Economic Forum) (OECD). However, ongoing geopolitical tensions and economic fragmentation are likely to maintain a level of uncertainty and volatility in the global economy (World Economic Forum.",
- icon: AutocompleteIcon,
- iconAlt: "Autocomplete",
- extraInfo:
- "Page Url: https://chatgpt.com/c/762cd44e-1752-495b-967a-aa3c23c6024a",
- },
- {
- content:
- "As of mid-2024, the global economy is experiencing modest growth with significant regional disparities. Global GDP growth is projected to be around 3.1% in 2024, rising slightly to 3.2% in 2025. This performance, although below the pre-pandemic average, reflects resilience despite various economic pressures, including tight monetary conditions and geopolitical tensions (IMF)(OECD) Inflation is moderating faster than expected, with global headline inflation projected to fall to 5.8% in 2024 and 4.4% in 2025, contributing to improving real incomes and positive trade growth (IMF) (OECD)",
- icon: blockIcon,
- iconAlt: "Autocomplete",
- extraInfo:
- "Page Url: https://www.cnbc.com/2024/05/23/nvidia-keeps-hitting-records-can-investors-still-buy-the-stock.html?&qsearchterm=nvidia",
- },
-];
+export default page
\ No newline at end of file
diff --git a/apps/web/app/(canvas)/canvasStyles.css b/apps/web/app/(canvas)/canvasStyles.css
index a53d8c96..04da2054 100644
--- a/apps/web/app/(canvas)/canvasStyles.css
+++ b/apps/web/app/(canvas)/canvasStyles.css
@@ -21,4 +21,8 @@
.tlui-minimap__canvas {
background: #1F2428 !important;
+}
+
+.tlui-dialog__overlay {
+ position: fixed;
}
\ No newline at end of file
diff --git a/apps/web/app/(canvas)/lib/context.tsx b/apps/web/app/(canvas)/lib/context.tsx
deleted file mode 100644
index 36a106cf..00000000
--- a/apps/web/app/(canvas)/lib/context.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import { createContext } from 'react';
-
-export interface DragContextType {
- isDraggingOver: boolean;
- setIsDraggingOver: React.Dispatch>;
-}
-
-
-const DragContext = createContext(undefined);
-
-export default DragContext;
\ No newline at end of file
diff --git a/apps/web/app/(canvas)/canvas.tsx b/packages/ui/components/canvas/components/canvas.tsx
similarity index 90%
rename from apps/web/app/(canvas)/canvas.tsx
rename to packages/ui/components/canvas/components/canvas.tsx
index aaf89a06..b76a3feb 100644
--- a/apps/web/app/(canvas)/canvas.tsx
+++ b/packages/ui/components/canvas/components/canvas.tsx
@@ -1,16 +1,16 @@
-import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { useCallback, useEffect, useRef, useState } from "react";
import { Editor, Tldraw, setUserPreferences, TLStoreWithStatus } from "tldraw";
-import { createAssetFromUrl } from "./lib/createAssetUrl";
+import { createAssetFromUrl } from "../lib/createAssetUrl";
import "tldraw/tldraw.css";
import { components } from "./enabledComp";
import { twitterCardUtil } from "./twitterCard";
import { textCardUtil } from "./textCard";
-import createEmbedsFromUrl from "./lib/createEmbeds";
-import { loadRemoteSnapshot } from "./lib/loadSnap";
+import createEmbedsFromUrl from "../lib/createEmbeds";
+import { loadRemoteSnapshot } from "../lib/loadSnap";
import { SaveStatus } from "./savesnap";
import { getAssetUrls } from "@tldraw/assets/selfHosted";
import { memo } from "react";
-import DragContext from "./lib/context";
+import DragContext from "../lib/context";
import DropZone from "./dropComponent";
import "./canvas.css";
diff --git a/packages/ui/components/canvas/draggableComponent.tsx b/packages/ui/components/canvas/components/draggableComponent.tsx
similarity index 100%
rename from packages/ui/components/canvas/draggableComponent.tsx
rename to packages/ui/components/canvas/components/draggableComponent.tsx
diff --git a/apps/web/app/(canvas)/dropComponent.tsx b/packages/ui/components/canvas/components/dropComponent.tsx
similarity index 92%
rename from apps/web/app/(canvas)/dropComponent.tsx
rename to packages/ui/components/canvas/components/dropComponent.tsx
index a14bd1f3..0374f367 100644
--- a/apps/web/app/(canvas)/dropComponent.tsx
+++ b/packages/ui/components/canvas/components/dropComponent.tsx
@@ -1,7 +1,7 @@
import React, { useRef, useCallback, useEffect, useContext } from "react";
import { useEditor } from "tldraw";
-import DragContext, { DragContextType } from "./lib/context";
-import { handleExternalDroppedContent } from "./lib/createEmbeds";
+import DragContext, { DragContextType, useDragContext } from "../lib/context";
+import { handleExternalDroppedContent } from "../lib/createEmbeds";
const stripHtmlTags = (html: string): string => {
const div = document.createElement("div");
@@ -33,17 +33,9 @@ function formatTextToRatio(text: string) {
return lines.join("\n");
}
-const useDrag = (): DragContextType => {
- const context = useContext(DragContext);
- if (!context) {
- throw new Error("useCounter must be used within a CounterProvider");
- }
- return context;
-};
-
function DropZone() {
const dropRef = useRef(null);
- const { isDraggingOver, setIsDraggingOver } = useDrag();
+ const { isDraggingOver, setIsDraggingOver } = useDragContext();
const editor = useEditor();
diff --git a/apps/web/app/(canvas)/enabledComp.tsx b/packages/ui/components/canvas/components/enabledComp copy.tsx
similarity index 100%
rename from apps/web/app/(canvas)/enabledComp.tsx
rename to packages/ui/components/canvas/components/enabledComp copy.tsx
diff --git a/packages/ui/components/canvas/components/enabledComp.tsx b/packages/ui/components/canvas/components/enabledComp.tsx
new file mode 100644
index 00000000..85811b82
--- /dev/null
+++ b/packages/ui/components/canvas/components/enabledComp.tsx
@@ -0,0 +1,22 @@
+import { TLUiComponents } from "tldraw";
+
+export const components: Partial = {
+ ActionsMenu: null,
+ MainMenu: null,
+ QuickActions: null,
+ TopPanel: null,
+ DebugPanel: null,
+ DebugMenu: null,
+ PageMenu: null,
+ // Minimap: null,
+ // ContextMenu: null,
+ // HelpMenu: null,
+ // ZoomMenu: null,
+ // StylePanel: null,
+ // NavigationPanel: null,
+ // Toolbar: null,
+ // KeyboardShortcutsDialog: null,
+ // HelperButtons: null,
+ // SharePanel: null,
+ // MenuPanel: null,
+};
\ No newline at end of file
diff --git a/apps/web/app/(canvas)/savesnap.tsx b/packages/ui/components/canvas/components/savesnap.tsx
similarity index 100%
rename from apps/web/app/(canvas)/savesnap.tsx
rename to packages/ui/components/canvas/components/savesnap.tsx
diff --git a/apps/web/app/(canvas)/textCard.tsx b/packages/ui/components/canvas/components/textCard.tsx
similarity index 53%
rename from apps/web/app/(canvas)/textCard.tsx
rename to packages/ui/components/canvas/components/textCard.tsx
index 065c5ae1..b24dae52 100644
--- a/apps/web/app/(canvas)/textCard.tsx
+++ b/packages/ui/components/canvas/components/textCard.tsx
@@ -1,11 +1,4 @@
-import {
- BaseBoxShapeUtil,
- HTMLContainer,
- TLBaseBoxShape,
- TLBaseShape,
- useIsEditing,
- useValue,
-} from "tldraw";
+import { BaseBoxShapeUtil, HTMLContainer, TLBaseShape } from "tldraw";
type ITextCardShape = TLBaseShape<
"Textcard",
@@ -25,37 +18,13 @@ export class textCardUtil extends BaseBoxShapeUtil {
}
component(s: ITextCardShape) {
- const isEditing = useIsEditing(s.id);
- const isHoveringWhileEditingSameShape = useValue(
- "is hovering",
- () => {
- const { editingShapeId, hoveredShapeId } =
- this.editor.getCurrentPageState();
-
- if (editingShapeId && hoveredShapeId !== editingShapeId) {
- const editingShape = this.editor.getShape(editingShapeId);
- if (
- editingShape &&
- this.editor.isShapeOfType(editingShape, "embed")
- ) {
- return true;
- }
- }
-
- return false;
- },
- [],
- );
-
- const isInteractive = isEditing || isHoveringWhileEditingSameShape;
return (
>;
+}
+
+const DragContext = createContext(undefined);
+
+export const useDragContext = () => {
+ const context = useContext(DragContext);
+ if (context === undefined) {
+ throw new Error('useAppContext must be used within an AppProvider');
+ }
+ return context;
+};
+
+export default DragContext;
\ No newline at end of file
diff --git a/apps/web/app/(canvas)/lib/createAssetUrl.ts b/packages/ui/components/canvas/lib/createAssetUrl.ts
similarity index 100%
rename from apps/web/app/(canvas)/lib/createAssetUrl.ts
rename to packages/ui/components/canvas/lib/createAssetUrl.ts
diff --git a/apps/web/app/(canvas)/lib/createEmbeds.ts b/packages/ui/components/canvas/lib/createEmbeds.ts
similarity index 100%
rename from apps/web/app/(canvas)/lib/createEmbeds.ts
rename to packages/ui/components/canvas/lib/createEmbeds.ts
diff --git a/apps/web/app/(canvas)/lib/loadSnap.ts b/packages/ui/components/canvas/lib/loadSnap.ts
similarity index 100%
rename from apps/web/app/(canvas)/lib/loadSnap.ts
rename to packages/ui/components/canvas/lib/loadSnap.ts