From 4b6a932b197e4c19af34e176bea014be0b9c9bcd Mon Sep 17 00:00:00 2001 From: codetorso Date: Sun, 23 Jun 2024 12:48:07 +0530 Subject: [PATCH 1/4] fix interactive canvas (2/2) --- apps/web/app/(canvas)/textCard.tsx | 28 +--------------------------- 1 file changed, 1 insertion(+), 27 deletions(-) diff --git a/apps/web/app/(canvas)/textCard.tsx b/apps/web/app/(canvas)/textCard.tsx index 065c5ae1..210bda1c 100644 --- a/apps/web/app/(canvas)/textCard.tsx +++ b/apps/web/app/(canvas)/textCard.tsx @@ -1,10 +1,7 @@ import { BaseBoxShapeUtil, HTMLContainer, - TLBaseBoxShape, TLBaseShape, - useIsEditing, - useValue, } from "tldraw"; type ITextCardShape = TLBaseShape< @@ -25,37 +22,14 @@ 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 (
Date: Mon, 24 Jun 2024 02:56:36 +0530 Subject: [PATCH 2/4] centered layout --- apps/web/app/(canvas)/canvas.css | 3 --- apps/web/app/(canvas)/canvasStyles.css | 4 ++++ apps/web/app/(canvas)/textCard.tsx | 9 ++------- 3 files changed, 6 insertions(+), 10 deletions(-) delete mode 100644 apps/web/app/(canvas)/canvas.css diff --git a/apps/web/app/(canvas)/canvas.css b/apps/web/app/(canvas)/canvas.css deleted file mode 100644 index 3e6700da..00000000 --- a/apps/web/app/(canvas)/canvas.css +++ /dev/null @@ -1,3 +0,0 @@ -.tlui-dialog__overlay { - position: fixed; -} 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)/textCard.tsx b/apps/web/app/(canvas)/textCard.tsx index 210bda1c..b24dae52 100644 --- a/apps/web/app/(canvas)/textCard.tsx +++ b/apps/web/app/(canvas)/textCard.tsx @@ -1,8 +1,4 @@ -import { - BaseBoxShapeUtil, - HTMLContainer, - TLBaseShape, -} from "tldraw"; +import { BaseBoxShapeUtil, HTMLContainer, TLBaseShape } from "tldraw"; type ITextCardShape = TLBaseShape< "Textcard", @@ -22,14 +18,13 @@ export class textCardUtil extends BaseBoxShapeUtil { } component(s: ITextCardShape) { - return (
Date: Mon, 24 Jun 2024 03:25:54 +0530 Subject: [PATCH 3/4] clean code+ user canvas (1/2) --- apps/web/app/(canvas)/canvas/[id]/page.tsx | 125 ++++++++++++++++++ apps/web/app/(canvas)/canvas/page.tsx | 124 +---------------- apps/web/app/(canvas)/lib/context.tsx | 11 -- .../components/canvas/components}/canvas.tsx | 10 +- .../{ => components}/draggableComponent.tsx | 0 .../canvas/components}/dropComponent.tsx | 14 +- .../canvas/components/enabledComp copy.tsx | 0 .../canvas/components/enabledComp.tsx | 22 +++ .../canvas/components}/savesnap.tsx | 0 .../canvas/components}/textCard.tsx | 0 .../canvas/components}/twitterCard.tsx | 0 packages/ui/components/canvas/lib/context.ts | 18 +++ .../components/canvas}/lib/createAssetUrl.ts | 0 .../ui/components/canvas}/lib/createEmbeds.ts | 0 .../ui/components/canvas}/lib/loadSnap.ts | 0 15 files changed, 177 insertions(+), 147 deletions(-) create mode 100644 apps/web/app/(canvas)/canvas/[id]/page.tsx delete mode 100644 apps/web/app/(canvas)/lib/context.tsx rename {apps/web/app/(canvas) => packages/ui/components/canvas/components}/canvas.tsx (90%) rename packages/ui/components/canvas/{ => components}/draggableComponent.tsx (100%) rename {apps/web/app/(canvas) => packages/ui/components/canvas/components}/dropComponent.tsx (92%) rename apps/web/app/(canvas)/enabledComp.tsx => packages/ui/components/canvas/components/enabledComp copy.tsx (100%) create mode 100644 packages/ui/components/canvas/components/enabledComp.tsx rename {apps/web/app/(canvas) => packages/ui/components/canvas/components}/savesnap.tsx (100%) rename {apps/web/app/(canvas) => packages/ui/components/canvas/components}/textCard.tsx (100%) rename {apps/web/app/(canvas) => packages/ui/components/canvas/components}/twitterCard.tsx (100%) create mode 100644 packages/ui/components/canvas/lib/context.ts rename {apps/web/app/(canvas) => packages/ui/components/canvas}/lib/createAssetUrl.ts (100%) rename {apps/web/app/(canvas) => packages/ui/components/canvas}/lib/createEmbeds.ts (100%) rename {apps/web/app/(canvas) => packages/ui/components/canvas}/lib/loadSnap.ts (100%) diff --git a/apps/web/app/(canvas)/canvas/[id]/page.tsx b/apps/web/app/(canvas)/canvas/[id]/page.tsx new file mode 100644 index 00000000..e58ab35e --- /dev/null +++ b/apps/web/app/(canvas)/canvas/[id]/page.tsx @@ -0,0 +1,125 @@ +"use client"; + +import { Canvas } from "@repo/ui/components/canvas/components/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/components/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"; + +function page() { + const [fullScreen, setFullScreen] = useState(false); + const [visible, setVisible] = useState(true); + + return ( +
+
+ { + l[0]! < 20 ? setVisible(false) : setVisible(true); + }} + className={` ${fullScreen ? "w-[calc(100vw-2rem)]" : "w-screen"} transition-all`} + direction="horizontal" + > + { + setTimeout(() => setFullScreen(false), 50); + }} + onCollapse={() => { + setTimeout(() => setFullScreen(true), 50); + }} + defaultSize={30} + collapsible={true} + > +
+
+ Change Filters + setting-icon +
+ {visible ? ( + + ) : ( +

+ Need more space to show! +

+ )} +
+ + +
+ drag-icon +
+ + +
+ +
+ + +
+
+ ); +} + +function SidePanel() { + const [value, setValue] = useState(""); + const [dragAsText, setDragAsText] = useState(false); + return ( + <> +
+ { + setValue(e.target.value); + }} + value={value} + // rows={1} + className="w-full resize-none rounded-xl bg-[#151515] px-3 py-4 text-xl text-[#989EA4] outline-none focus:outline-none sm:max-h-52" + /> +
+
+ setDragAsText(e)} + id="drag-text-mode" + /> + +
+ + + ); +} + +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 ( -
-
- { - l[0]! < 20 ? setVisible(false) : setVisible(true); - }} - className={` ${fullScreen ? "w-[calc(100vw-2rem)]" : "w-screen"} transition-all`} - direction="horizontal" - > - { - setTimeout(() => setFullScreen(false), 50); - }} - onCollapse={() => { - setTimeout(() => setFullScreen(true), 50); - }} - defaultSize={30} - collapsible={true} - > -
-
- Change Filters - setting-icon -
- {visible ? ( - - ) : ( -

- Need more space to show! -

- )} -
- - -
- drag-icon -
- - -
- -
- - -
-
- ); +
page
+ ) } -function SidePanel() { - const [value, setValue] = useState(""); - const [dragAsText, setDragAsText] = useState(false); - return ( - <> -
- { - setValue(e.target.value); - }} - value={value} - // rows={1} - className="w-full resize-none rounded-xl bg-[#151515] px-3 py-4 text-xl text-[#989EA4] outline-none focus:outline-none sm:max-h-52" - /> -
-
- setDragAsText(e)} - id="drag-text-mode" - /> - -
- - - ); -} - -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)/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 100% rename from apps/web/app/(canvas)/textCard.tsx rename to packages/ui/components/canvas/components/textCard.tsx diff --git a/apps/web/app/(canvas)/twitterCard.tsx b/packages/ui/components/canvas/components/twitterCard.tsx similarity index 100% rename from apps/web/app/(canvas)/twitterCard.tsx rename to packages/ui/components/canvas/components/twitterCard.tsx diff --git a/packages/ui/components/canvas/lib/context.ts b/packages/ui/components/canvas/lib/context.ts new file mode 100644 index 00000000..4e6ecd1c --- /dev/null +++ b/packages/ui/components/canvas/lib/context.ts @@ -0,0 +1,18 @@ +import { createContext, useContext } from 'react'; + +export interface DragContextType { + isDraggingOver: boolean; + setIsDraggingOver: React.Dispatch>; +} + +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 From 557c7b82eb89cf95f480896fbe41355352a01482 Mon Sep 17 00:00:00 2001 From: codetorso Date: Mon, 24 Jun 2024 03:54:53 +0530 Subject: [PATCH 4/4] Add Extension (1/2) --- apps/extension/README.md | 37 +++++++++++++++++++ apps/extension/background.ts | 25 +++++++++++++ apps/extension/content/ContentApp.tsx | 45 ++++++++++++++++++++++++ apps/extension/content/base.css | 3 ++ apps/extension/content/content.css | 6 ++++ apps/extension/content/content.tsx | 15 ++++++++ apps/extension/extension-env.d.ts | 9 +++++ apps/extension/index.html | 11 ++++++ apps/extension/manifest.json | 30 ++++++++++++++++ apps/extension/package.json | 20 +++++++++++ apps/extension/public/icon/logo(16).png | Bin 0 -> 980 bytes apps/extension/public/icon/logo(48).png | Bin 0 -> 2087 bytes apps/extension/tailwind.config.js | 8 +++++ apps/extension/tsconfig.json | 19 ++++++++++ 14 files changed, 228 insertions(+) create mode 100644 apps/extension/README.md create mode 100644 apps/extension/background.ts create mode 100644 apps/extension/content/ContentApp.tsx create mode 100644 apps/extension/content/base.css create mode 100644 apps/extension/content/content.css create mode 100644 apps/extension/content/content.tsx create mode 100644 apps/extension/extension-env.d.ts create mode 100644 apps/extension/index.html create mode 100644 apps/extension/manifest.json create mode 100644 apps/extension/package.json create mode 100644 apps/extension/public/icon/logo(16).png create mode 100644 apps/extension/public/icon/logo(48).png create mode 100644 apps/extension/tailwind.config.js create mode 100644 apps/extension/tsconfig.json 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!!! + + +

hello World! Follow @supermemoryai

+ + \ No newline at end of file diff --git a/apps/extension/manifest.json b/apps/extension/manifest.json new file mode 100644 index 00000000..529b0afe --- /dev/null +++ b/apps/extension/manifest.json @@ -0,0 +1,30 @@ + +{ + "name": "Supermemory.ai-Extension", + "description": "Uses the chrome.contextMenus API to customize the context menu.", + "version": "0.1", + "permissions": [ + "contextMenus" + ], + "manifest_version": 3, + "action": { + "default_popup": "index.html" + }, + "background": { + "service_worker": "./background.ts" + }, + "content_scripts": [ + { + "matches": [ + "" + ], + "js": [ + "./content/content.tsx" + ] + } + ], + "icons": { + "16": "public/icon/logo(16).png", + "48": "public/icon/logo(48).png" + } +} \ No newline at end of file diff --git a/apps/extension/package.json b/apps/extension/package.json new file mode 100644 index 00000000..7b06b3da --- /dev/null +++ b/apps/extension/package.json @@ -0,0 +1,20 @@ +{ + "devDependencies": { + "@types/react": "^18.0.9", + "@types/react-dom": "^18.0.5", + "react": "^18.1.0", + "react-dom": "^18.1.0", + "tailwindcss": "^3.4.1", + "typescript": "5.3.3", + "extension": "latest" + }, + "scripts": { + "dev": "extension dev", + "start": "extension start", + "build": "extension build" + }, + "dependencies": {}, + "name": "extension", + "private": true, + "version": "0.0.0" +} \ No newline at end of file diff --git a/apps/extension/public/icon/logo(16).png b/apps/extension/public/icon/logo(16).png new file mode 100644 index 0000000000000000000000000000000000000000..3c1610b0af68fac5090e67a19ec81f29ea9a889a GIT binary patch literal 980 zcmeAS@N?(olHy`uVBq!ia0vp^0wB!63?wyl`GbL!Lb6AYF9SoB8UsT^3j@P1pisjL z28L1t28LG&3=CE?7#PG0=IjczVPIhN3h)VW1uFOt0{{O0|NHO%zyJULYG?p?K>Gjx zUtk#$h>xghfu=wJ&@2S__x}%=^BHUnLLAP5YlDlRFbGJas0CXA_7+$et5%qMpc=ty zfW%KwAOQ9M`~U6Rf2fn8N`TaFh%7?j|9^wLDMG-|%q1H}Xs@c7g>=JQHcm5Q?a z);1I|*+pBIiG=d8bIJHIad9wO*OZ$$#OrCBri8O3GhK!mdFHCBFYsOhw2d*z+ueonKa=h~ zAcwug)7O>#1sgMixHc1~$aSF5D^C~45Q)pW=fcAeIS8;m*cm9IoE>q?&4rgkYy-Pa zN0UhPQKlQ*W&i(go@{&WcFl7?MW!Swdrh_ul z4~%$rMV5?dWlUfudN$x!On0w2!`&f84k zb;aFHth`UXvUW$UX1)@ztL)As?YFUZ+NJuZs(-V$yWf*P?$lg+NSkMV|BEj^?&oHU zPY=KDAiwn%BfpjT)gy23?qz&cKjDzHA>;FnKfn0=n|?j#`+xrDy5Ien|Mj0Q39l(+ zTKj(fefznBikp|`#-;#$tyS6G7 L^>bP0l+XkKZY&g& literal 0 HcmV?d00001 diff --git a/apps/extension/public/icon/logo(48).png b/apps/extension/public/icon/logo(48).png new file mode 100644 index 0000000000000000000000000000000000000000..de5a6d2e0520b0b4f471a849809982906e5e1d79 GIT binary patch literal 2087 zcmZ{lc{J1w7sr1Tqr8&FmYvWtmWe^8VLZ&lLAY%yb35fj6p$urM+&w0;z-*et`&%NJ!zW094{qv^S+ggepmOBgpfEdOK z<;Yj)-zg%@uP%Z+WWK0)SvlGOK#V2;#3cg2F5ik<1^^;|@v8>_!1Dn>CZzC<1A;#g z{=?c51?>MFkKR^g@f}b&#s&>q7Cr#T9KndSKHxhb4C=Q_gz0w^*1>M?r9kV<2Qbb{ zt@A%1DFKZslQ65>f@nj52^`W4X~Ez@c}lp0%V+KeHJ!o22o9|}v(1mja%ag(xf+gz zI{j&wI+B%Uff6g>_55f3CFIggovhQ@VM-hhj+9p5s=$$b6BUP?ktokj-qHAZtfd{> zNCqR`m9UNGvojrr;bfM!mX~6%msH=Ov4Vw%uy|jc7Nd{8xbxg8l)sG|RHavLy3=l5 zTE`~JG>19ilt`Fq2k6sr!tjMKA0Rz+VvU7!*WD%#Ar>1Ys<8tkECy&xhD}?=otlLprNsY}Dhzj-DTl*h( zB15M$!c2(<=Ic1)wc=TagIDxSB#Y&Ln;CDlRuJE)ZBLqX-aQa;GT;%aPQ7uymUo zD0r;^qI{Q*E>5A=;{Yug&7M3=L3soEr}FeNVi;T*^@L>D6Zu5-frck#6qT?dr}srD z{Yqs~BPC&ARgiUYrlB}W>Lz7j9x3U(_%W@jIFX{9vN?I`CswF6RN&>w<`+ihU?Q(V zkW{*EEb-|ZK7i2S-0UFTf184)FUEyPbRvT4dcIV}J>@W7Eh)Eu+WRVBN+8+%LPi(Ku|`F8-U0o-9Fh-!KP8$^7>9jkCYpTE(o%i+&Ak_#q1)F znx%`_p+ppyT=&J{61K7Dep(3G_mICvAO_E2WY_~xu{XlRjQ(ma_dm6Q~pTt@>ti$p<`@LrIn-<2SL>=6?2D~ z);>LFvOpbgVpxN#oo%bOnub<5%`jP$F26?+q`SL5jFJ0$P6FQ~Rtxf48r9Ylw3&4reu68Jkxv)Hn*j4mhaAzi%gGmU7LLRjfO z`g5%zGI^U=-pdvcWu{(hqA~-EqIJSgy$oq1ov-y&IYH|ulswq#gILPq&aA9s4@`RjC%?X;TN=|Xu^bnbn|5fDX;6$-VlS$|i zv+ZI3ScT-vy`IUV+$$UQY0wh}N4E4ZwC&&RIwn~YlFl$1s* z;zH_NvP=E=@0|<1BfaUJXTAtTDn~mr(!}r83`P`*95o;^C7tKB-d?H4lUmmw}r zeDx}PYb!i2chmNXfn)!n2#u!92!S07PB*A5W>wOU@s7H254zSrTShJ@pnVu0%1#Ek zsrtB3Nw`plvz^gHA~mBOH#GlQ+wUKIH@D%g?L`Kq&t<4l6=>U#WnPp{lzVc#Z$rBe z7NZHPQ_b{nLl(6BJ|CS{Gz7F`Z=8G7kQAG_Wi{#zAy~Z;>NOM4&+PY(IPnYVP%$*eVIv#}o)1;JV3~7R`&8Ds-%s(UGr{=eP>uC=Ud#4#2BpN6z52Qa2 z*_62$Dl5Pm#WQojrpzT??fTQS7g;N)P%u*emSjnfu%+)vr^wesSDQ~ZrPr770%uMP z?2DRFU(mE-?=-}eFa42^l~yfW&Fwx;EHlzt&X$RCGRR=NZ`ns27tQp_AhbXzY-N*j z-Jrz}6*&Hv)CfnrhI@O4*>J_j3N963dMI5T>lFQ z4EFZ(iT?k9WDb3v51jhXg>b(>d|0?=V95V6`tY-`e;>gxIY>SOV9>UxKg~T7{sPAY B=Dz>{ literal 0 HcmV?d00001 diff --git a/apps/extension/tailwind.config.js b/apps/extension/tailwind.config.js new file mode 100644 index 00000000..1beb1aca --- /dev/null +++ b/apps/extension/tailwind.config.js @@ -0,0 +1,8 @@ +module.exports = { + content: ['**/*.html', '**/*.tsx'], + theme: { + extend: {} + }, + plugins: [] +} +module.exports = require("@repo/tailwind-config/tailwind.config"); \ No newline at end of file diff --git a/apps/extension/tsconfig.json b/apps/extension/tsconfig.json new file mode 100644 index 00000000..8538580f --- /dev/null +++ b/apps/extension/tsconfig.json @@ -0,0 +1,19 @@ +{ + "extends": "@repo/typescript-config/nextjs.json", + "compilerOptions": { + "allowJs": true, + "allowSyntheticDefaultImports": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "isolatedModules": false, + "jsx": "react-jsx", + "lib": ["dom", "dom.iterable", "esnext"], + "moduleResolution": "node", + "module": "esnext", + "resolveJsonModule": true, + "strict": true, + "target": "esnext" + }, + "include": ["./"], + "exclude": ["node_modules", "dist"] +} \ No newline at end of file