TypeCellOS / BlockNote

A React Rich Text Editor that's block-based (Notion style) and extensible. Built on top of Prosemirror and Tiptap.
https://www.blocknotejs.org/
Mozilla Public License 2.0
5.89k stars 381 forks source link

`resolveFileUrl` won't get called. #885

Closed softmarshmallow closed 4 days ago

softmarshmallow commented 4 days ago

The resolveFileUrl won't get executed by the response from the uploadFile

  const editor = useCreateBlockNote({
    dictionary: {
      ...locales.en,
      placeholders: {
        ...locales.en.placeholders,
        default: placeholder || locales.en.placeholders.default,
      },
    },
    // https://github.com/TypeCellOS/BlockNote/issues/884
    // trailingBlock: false,
    initialContent: initialContent,
    uploadFile: uploader
      ? async (file) => {
          const { path } = await uploader(file);

          return path!;
        }
      : undefined,
    resolveFileUrl: resolver
      ? async (url) => {
          const resolved = await resolver?.({
            path: url,
          });

          return resolved!.publicUrl;
        }
      : undefined,
  });

I ended up doing this

const editor = useCreateBlockNote({
    dictionary: {
      ...locales.en,
      placeholders: {
        ...locales.en.placeholders,
        default: placeholder || locales.en.placeholders.default,
      },
    },
    // https://github.com/TypeCellOS/BlockNote/issues/884
    // trailingBlock: false,
    initialContent: initialContent,
    uploadFile: uploader
      ? async (file) => {
          const { path } = await uploader(file);

          const resolved = await resolver!({ path: path! });

          return resolved!.publicUrl!;
        }
      : undefined,
    // resolveFileUrl: resolver
    //   ? async (url) => {
    //       console.log("resolveFileUrl");
    //       console.log(url);
    //       const resolved = await resolver?.({
    //         path: url,
    //       });

    //       console.log(resolved);

    //       return resolved!.publicUrl;
    //     }
    //   : undefined,
  });

Note the path is not a url, but a relative path to a certain bucket. (Yet this should not be a problem since BlockNote will not check if its a valid url or not (ok if its just a string)

The example does not show how to use resolveFileUrl and tsdoc does not give much of a information.

I need this feature since I am building a SaaS where customer can choose their own bucket and uploading strategy, and the file handling should be staged and disposed (cannot use a actual link) the link will be transfomed tmp->real on submission.

softmarshmallow commented 4 days ago

My bad. confused that the uploadFile should return { url: '...' } (its not)