Nextcloud integration for notion

Hello,
Do you know if someone has already created a notion extension to be able to add files from his nextcloud server like what we can already do with Google chrome?

Thanks in advance,
Dimoxxx

There is not. You could write something using the Notion API.

As notion is totally proprietary, the ball is basically in their court to consider supporting open standards like webdav (Nextcloud file storage). Here are the API details for setting that up.

I think the truth of the matter is Nextcloud is hopeful you will consider their existing apps and integrations: Deck, Tasks, Notes, etc. instead. OpenProject would be the closest open source alternative to notion that I’m aware of. All of these apps have their own API’s available in their documentation.

tldr, It makes sense you want notion support, but the underlying intention of Nextcloud as a platform is to move users away from exactly these kinds of proprietary tools. Instead, the hope is you will get your data off of those platforms entirely to use fully open alternatives. Of course, you are also welcome to create the integrations yourself.

I totally agree with you and should have started with that in my post. I have been using nextcloud for a little over 2 years in an effort to get away from proprietary platforms as much as possible.

However, I discovered the use of notion for work and I noticed an impressive gain in productivity. So I looked for an opensource alternative and I found Appflowy but the project is very new and it still lacks the features I need.

So I found a compromise with the ownership of my notes and my files…
ChatGPT generated this extension for me but there is a problem with the connection to my notion space.

Can someone who knows JS better than me take a look at it?

const { Client } = require('@notionhq/client');
const { Server, Client: NextcloudClient } = require('nextcloud-node-client');

// Initialiser le client Notion avec votre token d'authentification
const notion = new Client({ auth: process.env.secret });

// Créer le serveur Nextcloud avec les identifiants explicites
const server = new Server({
  basicAuth: {
    password: 'password',
    username: 'user',
  },
  url: 'https://cloud.exemple.com',
});

// Initialiser un objet NextcloudClient avec le serveur créé
const client = new NextcloudClient(server);

async function initExtension() {
  // Récupérer la page Notion en utilisant son URL
  const pageUrl = 'https://www.notion.so/';
  const page = await notion.pages.retrieve({ url: pageUrl });

  // Récupérer la liste des fichiers depuis Nextcloud
  const files = await client.files.list('/');

  // Créer l'interface utilisateur pour sélectionner les fichiers
  const fileSelectionUI = document.createElement('select');
  fileSelectionUI.id = 'file-selection';

  files.forEach((file) => {
    const option = document.createElement('option');
    option.text = file.name;
    option.value = file.path;

    fileSelectionUI.appendChild(option);
  });

  // Créer l'interface utilisateur pour afficher les fichiers ajoutés
  const filesAddedUI = document.createElement('div');
  filesAddedUI.id = 'current-files';

  // Créer le bouton d'ajout de fichiers
  const addButton = document.createElement('button');
  addButton.id = 'add-file-button';
  addButton.innerText = 'Ajouter un fichier';

  // Ajouter les éléments de l'interface utilisateur à la page Notion
  await notion.blocks.children.append({
    block_id: page.id,
    children: [fileSelectionUI, addButton, filesAddedUI],
  });

  // Ajouter un gestionnaire d'événements pour le bouton d'ajout de fichiers
  addButton.addEventListener('click', async () => {
    const selectedFilePath = fileSelectionUI.value;
    const selectedFile = files.find((file) => file.path === selectedFilePath);

    if (!selectedFile) {
      return;
    }

    const blockIds = await addFilesToPage([selectedFile], page.id);

    // Mettre à jour l'interface utilisateur pour refléter les fichiers ajoutés
    blockIds.forEach((blockId) => {
      const fileAddedUI = document.createElement('p');
      fileAddedUI.innerText = files.find((file) => file.path === blockId).name;

      filesAddedUI.appendChild(fileAddedUI);
    });
  });
}

async function addFilesToPage(files, pageId) {
  // Créer les blocs de fichier à ajouter à la page
  const newBlocks = files.map((file) => ({
    type: 'embed',
    embed: {
      url: 'https://cloud.exemple.com' + file.path,
      caption: {
        type: 'text',
        text: file.name,
      },
    },
  }));

  // Ajouter les blocs de fichier à la page Notion
  const response = await notion.blocks.children.append({
    block_id: pageId,
    children: newBlocks,
  });

  // Récupérer les IDs des blocs ajoutés
  return response.results.map((result) => result.id);
}

// Initialiser l'extension
initExtension();

I find your way of working a bit difficult and I have problems with it.

Please don’t create “code” with ChatGPT and expect developers to spend their valuable time to help you with fixing the “code”. Instead try to invest in your skills and follow our tutorials, so you know what you are doing, and look at existing integrations that you can tweak.

Don’t expect ChatGPT to do the process of ‘understanding’ for you and then throw the mess in the forum.

Don’t get me wrong, it is totally welcome to ask questions about coding, but using ChatGPT is not coding.

Maybe you are interested in our tutorials and resources that will help you to get started in our app ecosystem, which you can find here!

edit: sorry, I think I might be too harsh in my tone of voice here. I will open a larger discussion with the community about ChatGPT and if we should allow it or not. No decision to block your question has been made yet. I do wish you all the best of luck with your app and find it cool that you are looking into Nextcloud app development. Apart from linking to the tutorials I have no helpful comments for you to solve your bug.

2 Likes

Without a concrete problems description, also the devs would have a hard time to guess the problems you are facing. So, you will have to be a bit more specific on what is (not) working and what is expected.

Christian

Personally I don’t even look at code that isn’t written with english as the language. That is the first mistake they did. Always write your source code with english as the language in it and its comments.

Hello,
Thank you for your valuable comments. I will investigate on my side to solve my problems by myself and will post the result if it is conclusive

1 Like