How to do an upload to a repeatable component?

Questions and Answers Frontend-React
1

Hey yall,
I am currently developing a nextjs App with strapi while I am very new to those techniques. At the moment I get stuck with creating a PDF upload to a repeatable component. How can it be done? I am very stuck since its difficult for me to understand the Strapi Docs here… Let me tell a little bit more in my next messages on this.

My shema for the component cert_documents looks like this:

{
  "kind": "collectionType",
  "collectionName": "cert_documents",
  "info": {
    ...
  },
  "options": {
    "draftAndPublish": true
  },
  "pluginOptions": {},
  "attributes": {
    "document": {
      "type": "media",
      "multiple": false,
      "required": false,
      "allowedTypes": [
        "files",
        "images"
      ]
    },
    ...
    ...
    "cdl_tasks": {
      "displayName": "CDL Tasks",
      "type": "component",
      "repeatable": true,
      "component": "cdl-tasks.cdl-tasks"
    }
  }
}

The file components/cdl-tasks/cdl-tasks.json contains:

{
  "collectionName": "components_cdl_tasks_cdl_tasks",
  "info": {
    "displayName": "CDL Tasks",
    "description": ""
  },
  "options": {},
  "attributes": {
    ...
    "certificate_doc": {
      "type": "media",
      "multiple": false,
      "required": false,
      "allowedTypes": [
        "images",
        "files"
      ]
    },
   ...
  }
}

Now I have the following szenario: The backend-user will create a new cert-documents entry. This user will also create an instance of the component and fill some fields not shown in the above example exept for the certificate_doc relation. In my next app a frontend user will take this entry (the instance of the component and uploads a certificate_doc.
Do you have an Idea how I can do this? Is there a way to upload and relate the doc to the component entry? I already tried to figure out this by my own with the docs and with the help of the kapa-Bot on the strapi discord server but it isnt working and my code makes no sense at all.
But if you want to read my code anyway: Backend: GitHub - onissen/comdock-backend: Strapi Backend for a WebApp to view and store simulated company informations ; Frontend: GitHub - onissen/comdock-frontend

I fetch from the strapi API with this function:

export async function fetcher(endpoint, query, options = {}) {
    let response;
    let url
    
    if (!query || query == ``) {
      url = process.env.NEXT_PUBLIC_STRAPI_URL+'/api/'+endpoint
    } else {
      url = process.env.NEXT_PUBLIC_STRAPI_URL+'/api/'+endpoint+'?'+query
    }

    if (!options) {
      response = await fetch(url);
    } else {
      response = await fetch(url, options);
    }

    const data = await response.json();
    return data;
  }

Unfortunately NEXT_PUBLIC_STRAPI_URL is localhost:1337

Please let me know if you need more infos!!!