feat: prioritize Thingport Grab in import guidance

docs/features/importing.md

@@ -8,11 +8,12 @@ back to where it came from. If the original page disappears, the model is still
 - **Paste a link.** Click **Add → Import** and paste a model link from MakerWorld, Printables, Thingiverse,
   MyMiniFactory, Snapmaker Space, MakerOnline, Creality Cloud or NexPrint, or any direct link to a model file. Paste several links, one per line, and they're imported one after
   another as a background job. You can also paste a link straight into the search bar.
-- **Use the bookmarklet.** Drag the [bookmarklet](../guides/bookmarklet.md) to your bookmarks bar, and clicking it on
-  a model's page opens Thingport with the link already in the import dialog. Nothing to install.
 - **Use Thingport Grab.** The [browser extension](../../extension/README.md) adds a Thingport button to model pages on
   all eight sites (MyMiniFactory, Snapmaker Space, MakerOnline, Creality Cloud and NexPrint once you allow them, with a single click in its popup), so you can
   import without leaving the page, file the model into a collection, and import whole collections.
+  This is the recommended way to import.
+- **Or use the bookmarklet.** Without the extension, drag the [bookmarklet](../guides/bookmarklet.md) to your
+  bookmarks bar: clicking it on a model's page opens Thingport with the link already in the import dialog.
 - **Import a collection or your likes.** Paste a collection link, or your Thingiverse likes, and pick which models to
   bring in. Your Snapmaker Space likes and bookmarks import from your profile's Interactions tab with Thingport Grab,
   and your Creality Cloud likes from their page, in Thingport or with Grab. MakerWorld collections are imported with Thingport Grab.

docs/guides/bookmarklet.md

@@ -4,10 +4,10 @@ A bookmarklet is a bookmark that runs a small piece of code instead of opening a
 the page you're on to your Thingport: click it on a model's page, and Thingport opens in a new tab with the import
 dialog already filled in with that page's link. One more click on **Import** and the model is on its way.
 
-It works in any browser, with nothing to install. It does less than [Thingport Grab](../../extension/README.md), the
-browser extension, which imports right on the model page, files the model into a collection, imports whole
-collections and is the only way to import from some sites. The bookmarklet is the quick way to import one model at a
-time without it.
+> **[Thingport Grab](../../extension/README.md), the browser extension, is the recommended way to import.** It
+> imports right on the model page, files the model into a collection, imports whole collections, and some sites, such
+> as MakerOnline, only work through it. The bookmarklet is an alternative for when you can't or would rather not
+> install the extension: it works in any browser, with nothing to install, one model at a time.
 
 ## Add the bookmarklet
 

frontend/src/components/BookmarkletGuideDialog.tsx

@@ -1,4 +1,5 @@
 import { useTranslation } from "react-i18next";
+import Alert from "@mui/material/Alert";
 import Box from "@mui/material/Box";
 import Button from "@mui/material/Button";
 import Dialog from "@mui/material/Dialog";
@@ -7,6 +8,7 @@ import DialogContent from "@mui/material/DialogContent";
 import DialogTitle from "@mui/material/DialogTitle";
 import Stack from "@mui/material/Stack";
 import Typography from "@mui/material/Typography";
+import ExtensionOutlinedIcon from "@mui/icons-material/ExtensionOutlined";
 import OpenInNewIcon from "@mui/icons-material/OpenInNew";
 import BookmarkletButton from "./BookmarkletButton";
 import BookmarkletAnimation from "./importAnimations/BookmarkletAnimation";
@@ -17,16 +19,31 @@ const GUIDE_URL = `${THINGPORT_WEBSITE_URL}docs/guides/bookmarklet/`;
 type Props = {
   open: boolean;
   onClose: () => void;
+  /** Goes to the Download page, for Thingport Grab. */
+  onGetExtension: () => void;
 };
 
 /** How the bookmarklet works, shown, and the bookmarklet itself to drag to the bookmarks bar. */
-export default function BookmarkletGuideDialog({ open, onClose }: Props) {
+export default function BookmarkletGuideDialog({ open, onClose, onGetExtension }: Props) {
   const { t } = useTranslation(["app", "common"]);
   const steps = t("bookmarklet.guide.steps", { returnObjects: true }) as string[];
   return (
     <Dialog open={open} onClose={onClose} fullWidth maxWidth="xs">
       <DialogTitle>{t("bookmarklet.guide.title")}</DialogTitle>
       <DialogContent>
+        {/* Grab does more and some sites need it, so it's offered first. */}
+        <Alert
+          severity="info"
+          icon={<ExtensionOutlinedIcon fontSize="small" />}
+          sx={{ mb: 2 }}
+          action={
+            <Button color="inherit" size="small" onClick={onGetExtension} sx={{ whiteSpace: "nowrap" }}>
+              {t("bookmarklet.guide.getExtension")}
+            </Button>
+          }
+        >
+          {t("bookmarklet.guide.extensionRecommended")}
+        </Alert>
         <Box sx={{ display: "flex", justifyContent: "center", mb: 2 }}>
           <BookmarkletAnimation width={280} />
         </Box>

frontend/src/components/Layout/AddMenu.tsx

@@ -402,7 +402,15 @@ const AddMenu = React.forwardRef<AddMenuHandle, Props>(function AddMenu(
         </DialogActions>
       </Dialog>
 
-      <BookmarkletGuideDialog open={bookmarkletGuideOpen} onClose={() => setBookmarkletGuideOpen(false)} />
+      <BookmarkletGuideDialog
+        open={bookmarkletGuideOpen}
+        onClose={() => setBookmarkletGuideOpen(false)}
+        onGetExtension={() => {
+          setBookmarkletGuideOpen(false);
+          setImportOpen(false);
+          navigate("/downloads");
+        }}
+      />
       {upload.modals}
     </>
   );

frontend/src/i18n/locales/en.json

@@ -1712,7 +1712,7 @@
     },
     "bookmarklet": {
       "heading": "Bookmarklet",
-      "help": "Drag the button to your browser's bookmarks bar. On a model's page on a supported site, click the bookmark: Thingport opens with the import dialog filled in with that page's link.",
+      "help": "Drag the button to your browser's bookmarks bar. On a model's page on a supported site, click the bookmark: Thingport opens with the import dialog filled in with that page's link. Thingport Grab, the browser extension, is the recommended way to import; this is a lighter alternative.",
       "linkLabel": "Send to Thingport",
       "dragHint": "Drag this to your bookmarks bar",
       "copy": "Copy the bookmarklet code",
@@ -1727,7 +1727,9 @@
           "Click the bookmark. Thingport opens with the link already in the import dialog: click Import."
         ],
         "cantDrag": "Can't drag, as on a phone? Copy the code, bookmark any page, then edit the bookmark and paste the code as its address.",
-        "readMore": "Read the guide"
+        "readMore": "Read the guide",
+        "extensionRecommended": "Thingport Grab, the browser extension, is the recommended way to import: it works right on the model page, brings in whole collections, and some sites only work with it. The bookmarklet is a lighter alternative for one model at a time.",
+        "getExtension": "Get Grab"
       }
     }
   },

frontend/src/i18n/locales/lt.json

@@ -1768,7 +1768,7 @@
     },
     "bookmarklet": {
       "heading": "Žymių programėlė",
-      "help": "Nutempkite mygtuką į naršyklės žymių juostą. Palaikomos svetainės modelio puslapyje spustelėkite žymę: atsidarys Thingport su importavimo langu, į kurį jau įrašyta to puslapio nuoroda.",
+      "help": "Nutempkite mygtuką į naršyklės žymių juostą. Palaikomos svetainės modelio puslapyje spustelėkite žymę: atsidarys Thingport su importavimo langu, į kurį jau įrašyta to puslapio nuoroda. Rekomenduojamas importavimo būdas yra naršyklės plėtinys Thingport Grab; tai paprastesnė alternatyva.",
       "linkLabel": "Siųsti į Thingport",
       "dragHint": "Nutempkite tai į žymių juostą",
       "copy": "Kopijuoti žymių programėlės kodą",
@@ -1783,7 +1783,9 @@
           "Spustelėkite žymę. Atsidarys Thingport su nuoroda importavimo lange: spustelėkite „Importuoti“."
         ],
         "cantDrag": "Negalite nutempti, pvz., telefone? Nukopijuokite kodą, pažymėkite bet kurį puslapį, tada redaguokite žymę ir įklijuokite kodą kaip jos adresą.",
-        "readMore": "Skaityti vadovą"
+        "readMore": "Skaityti vadovą",
+        "extensionRecommended": "Rekomenduojamas importavimo būdas yra naršyklės plėtinys Thingport Grab: jis veikia tiesiai modelio puslapyje, importuoja ištisas kolekcijas, o kai kurios svetainės veikia tik su juo. Žymių programėlė yra paprastesnė alternatyva vienam modeliui importuoti.",
+        "getExtension": "Gauti Grab"
       }
     }
   },

web/src/lib/site.mjs

@@ -90,7 +90,7 @@ export const DOCS = [
     title: "Import with a bookmarklet",
     nav: "Bookmarklet",
     description:
-      "Add a bookmark that opens Thingport's import dialog with the model page you're on, in any browser and with nothing to install.",
+      "An alternative to Thingport Grab: a bookmark that opens Thingport's import dialog with the model page you're on, in any browser.",
   },
   {
     slug: "features/importing",

web/src/pages/features/index.astro

@@ -27,7 +27,7 @@ const SECTIONS: FeatureSection[] = [
     intro: "Thingport keeps a real copy of every model, so it's still there if the original page disappears.",
     points: [
       "Paste a MakerWorld, Printables, Thingiverse or MyMiniFactory link, or any direct link to a model file.",
-      "Or click the bookmarklet in your bookmarks bar on a model's page, and Thingport opens with the link ready to import.",
+      "No extension? Click the bookmarklet in your bookmarks bar on a model's page, and Thingport opens with the link ready to import.",
       "Import whole collections and your likes in one go. Big imports run as background jobs you can follow, with a notification when they finish.",
       "A model you already have is never imported twice, so running a collection import again only brings in what's new.",
       "Sync a collection, and models added to it later are imported on their own.",