From 1b0b5f2ba5195da55c9b747f3a6d817a2b8f5a94 Mon Sep 17 00:00:00 2001
From: Isaac Roberts <119639439+madebyisaacr@users.noreply.github.com>
Date: Thu, 25 Jun 2026 12:25:21 -0400
Subject: [PATCH 1/2] Fix permissions handling in Unsplash

---
 plugins/unsplash/src/App.tsx | 19 ++++++++++---------
 1 file changed, 10 insertions(+), 9 deletions(-)

diff --git a/plugins/unsplash/src/App.tsx b/plugins/unsplash/src/App.tsx
index 13dc41def..c8c84b8bb 100644
--- a/plugins/unsplash/src/App.tsx
+++ b/plugins/unsplash/src/App.tsx
@@ -22,7 +22,7 @@ const minWindowWidth = mode === "canvas" ? 260 : 600
 const minColumnWidth = 100
 const columnGap = 5
 const sidePadding = 15 * 2
-const resizable = framer.mode === "canvas"
+const resizable = mode === "canvas"
 
 void framer.showUI({
     position: "top right",
@@ -34,7 +34,7 @@ void framer.showUI({
 })
 
 export function App() {
-    const isAllowedToUpsertImage = useIsAllowedTo("addImage", "setImage")
+    const isAllowedToUpsertImage = useIsAllowedTo(mode === "canvas" ? "addImage" : "setImage")
 
     const [query, setQuery] = useState("")
 
@@ -42,7 +42,6 @@ export function App() {
 
     const addRandomMutation = useMutation({
         mutationFn: async (query: string) => {
-            const mode = framer.mode
             const randomPhoto = await getRandomPhoto(query)
 
             if (mode === "canvas") {
@@ -83,7 +82,7 @@ export function App() {
                 </div>
             </div>
             <AppErrorBoundary>
-                <PhotosList query={debouncedQuery} />
+                <PhotosList query={debouncedQuery} isAllowedToUpsertImage={isAllowedToUpsertImage} />
             </AppErrorBoundary>
             <div className="mt-[15px] px-[15px]">
                 <button
@@ -104,9 +103,13 @@ export function App() {
 
 type PhotoId = string
 
-const PhotosList = memo(function PhotosList({ query }: { query: string }) {
-    const isAllowedToUpsertImage = useIsAllowedTo("addImage", "setImage")
-
+const PhotosList = memo(function PhotosList({
+    query,
+    isAllowedToUpsertImage,
+}: {
+    query: string
+    isAllowedToUpsertImage: boolean
+}) {
     const { data, fetchNextPage, isFetchingNextPage, isLoading, hasNextPage } = useListPhotosInfinite(query)
     const scrollRef = useRef<HTMLDivElement>(null)
     const [windowWidth, setWindowWidth] = useState(window.innerWidth)
@@ -147,8 +150,6 @@ const PhotosList = memo(function PhotosList({ query }: { query: string }) {
 
     const addPhotoMutation = useMutation({
         mutationFn: async (photo: UnsplashPhoto) => {
-            const mode = framer.mode
-
             if (mode === "canvas") {
                 await framer.addImage({
                     image: photo.urls.full,

From cdd64b82cd858be65b958b48171af99736fe049f Mon Sep 17 00:00:00 2001
From: Isaac Roberts <119639439+madebyisaacr@users.noreply.github.com>
Date: Thu, 25 Jun 2026 12:28:52 -0400
Subject: [PATCH 2/2] Dither and ASCII

---
 plugins/ascii/src/App.tsx  | 5 ++++-
 plugins/dither/src/App.tsx | 5 ++++-
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/plugins/ascii/src/App.tsx b/plugins/ascii/src/App.tsx
index b982e6dbb..50f766448 100644
--- a/plugins/ascii/src/App.tsx
+++ b/plugins/ascii/src/App.tsx
@@ -55,7 +55,10 @@ function ASCIIPlugin({ framerCanvasImage }: { framerCanvasImage: ImageAsset | nu
     const asciiRef = useRef<ASCIIRef | null>(null)
     const { gl, toBytes, program, setProgram, setResolution } = useOGLPipeline()
 
-    const isAllowedToUpsertImage = useIsAllowedTo("addImage", "setImage")
+    const isAllowedToAddImage = useIsAllowedTo("addImage")
+    const isAllowedToSetImage = useIsAllowedTo("setImage")
+    const isAllowedToUpsertImage =
+        framer.mode === "canvas" ? isAllowedToAddImage && isAllowedToSetImage : isAllowedToSetImage
 
     useEffect(() => {
         asciiRef.current?.setPixelSize(exportSize * 0.02)
diff --git a/plugins/dither/src/App.tsx b/plugins/dither/src/App.tsx
index b9bf1d2bf..8009a20aa 100644
--- a/plugins/dither/src/App.tsx
+++ b/plugins/dither/src/App.tsx
@@ -42,7 +42,10 @@ export interface DroppedAsset {
 }
 
 function DitherImage({ image }: { image: ImageAsset | null }) {
-    const isAllowedToUpsertImage = useIsAllowedTo("addImage", "setImage")
+    const isAllowedToAddImage = useIsAllowedTo("addImage")
+    const isAllowedToSetImage = useIsAllowedTo("setImage")
+    const isAllowedToUpsertImage =
+        framer.mode === "canvas" ? isAllowedToAddImage && isAllowedToSetImage : isAllowedToSetImage
 
     const canvasContainerRef = useRef<HTMLDivElement>(null)
     const [droppedAsset, setDroppedAsset] = useState<DroppedAsset | null>()