id: constructPath()

in apps/chat/src/components/Files/PreUploadModal.tsx [347:495]
142 lines of code
7 McCabe index (conditional complexity)

          id: constructPath(
            getFileRootId(),
            folderPath,
            prepareFileName(file.name),
          ),
          folderPath,
        };
      }),
    );
  }, [folderPath]);

  return (
    <Modal
      portalId="theme-main"
      containerClassName="flex flex-col gap-4 md:w-[425px] w-full max-w-[425px] px-3 py-4 md:p-6"
      dataQa="pre-upload-modal"
      state={isOpen ? ModalState.OPENED : ModalState.CLOSED}
      onClose={() => onClose(false)}
      dismissProps={OUTSIDE_PRESS_AND_MOUSE_EVENT}
    >
      <div className="flex flex-col gap-2 overflow-auto">
        <div className="flex justify-between">
          <h2 id={headingId} className="text-base font-semibold">
            {t('Upload from device')}
          </h2>
        </div>
        <p id={descriptionId} data-qa="supported-attributes">
          {t(
            'Max file size up to 512 Mb. Supported types: {{allowedExtensions}}.',
            {
              allowedExtensions:
                allowedTypesLabel ||
                allowedExtensions.join(', ') ||
                'no available extensions',
            },
          )}
        </p>

        <div>
          <ErrorMessage error={errorMessage} />
        </div>

        <div
          className="flex flex-col gap-2 overflow-auto"
          data-qa="uploaded-files"
        >
          <div className="flex flex-col gap-1">
            <div>
              <span className="text-xs text-secondary">{t('Upload to')}</span>
              <span className="text-xs text-accent-primary">&nbsp;*</span>
            </div>
            <button
              className="flex grow cursor-default items-center justify-between rounded border border-primary bg-transparent px-3 py-2 placeholder:text-secondary hover:border-accent-primary focus:border-accent-primary focus:outline-none"
              data-qa="change-path-container"
            >
              <span className="truncate" data-qa="path">
                {constructPath(t('All files'), folderPath)}
              </span>
              <span
                className="cursor-pointer text-accent-primary"
                onClick={handleFolderChange}
                data-qa="change-button"
              >
                {t('Change')}
              </span>
            </button>
          </div>

          {selectedFiles.length !== 0 && (
            <div className="flex flex-col gap-1">
              <div>
                <span className="text-xs text-secondary">{t('Files')}</span>
                <span className="text-xs text-accent-primary">&nbsp;*</span>
              </div>
              <div className="flex flex-col gap-3 overflow-auto text-sm">
                {selectedFiles.map((file, index) => (
                  <div
                    key={index}
                    className="flex items-center gap-3"
                    data-qa="uploaded-file"
                  >
                    <div className="relative flex grow items-center">
                      <IconFile
                        className="absolute left-2 top-[calc(50%_-_9px)] shrink-0 text-secondary"
                        size={18}
                      />
                      <input
                        type="text"
                        value={getFileNameWithoutExtension(file.name)}
                        className="grow text-ellipsis rounded border border-primary bg-transparent py-2 pl-8 pr-12 placeholder:text-secondary hover:border-accent-primary focus:border-accent-primary focus:outline-none"
                        onChange={handleRenameFile(index)}
                      />
                      <span
                        className="absolute right-2"
                        data-qa="file-extension"
                      >
                        {getFileNameExtension(file.name)}
                      </span>
                    </div>

                    <button
                      onClick={handleUnselectFile(index)}
                      data-qa="delete-file"
                    >
                      <IconTrashX
                        size={24}
                        className="shrink-0 text-secondary hover:text-accent-primary"
                      />
                    </button>
                  </div>
                ))}
              </div>
            </div>
          )}
        </div>
      </div>
      <div className="flex w-full justify-between gap-3">
        <label
          className="cursor-pointer rounded py-2.5 text-accent-primary"
          data-qa="add-more-files"
        >
          {t('Add more files...')}
          <input
            ref={uploadInputRef}
            id="file"
            type="file"
            className="hidden"
            multiple
            accept={allowedTypes.join()}
            onChange={handleSelectFiles}
          />
        </label>

        <button
          className="button button-primary"
          onClick={handleUpload}
          disabled={selectedFiles.length === 0}
          data-qa="upload"
        >
          {customUploadButtonLabel ? customUploadButtonLabel : t('Upload')}
        </button>
      </div>

      <SelectFolderModal
        isOpen={isChangeFolderModalOpened}
        initialSelectedFolderId={selectedFolderId}
        rootFolderId={getFileRootId()}
        onClose={(folderId) => {
          if (folderId) {