osjs-client icon indicating copy to clipboard operation
osjs-client copied to clipboard

An open dialog for directories

Open mahsashadi opened this issue 3 years ago • 8 comments

In below code, I have a dialog which let user to select and open files:

import React from 'react';
export default function App ({win, proc}) {
  const [basic] = React.useState(() => core.make('osjs/basic-application', proc, win));

    return (
      <Button onClick={() => basic.createOpenDialog()}>Browser Files</Button>
    );
}

How can I make a dialog to only let user select and open among directories?

mahsashadi avatar Apr 17 '21 10:04 mahsashadi

There is a filetype property for dialogs, but it doesn't seem like this is available from basic application abstration. I will add this.

andersevenrud avatar Apr 17 '21 13:04 andersevenrud

You should now be able to do basic.createOpenDialog({ filetype: 'directory' })

andersevenrud avatar Apr 17 '21 13:04 andersevenrud

You should now be able to do basic.createOpenDialog({ filetype: 'directory' })

Thank you, now it is available, But I think the path of selected directory in returned object is not correct.

For example if I select TEST directory in HOME , the path will be "HOME:/" ( it does not contain the very last directory in selected path)

mahsashadi avatar Apr 18 '21 05:04 mahsashadi

Hi there.

But I think the path of selected directory in returned object is not correct.

For example if I select TEST directory in HOME , the path will be "HOME:/" ( it does not contain the very last directory in selected path)

Sorry but I faced this problem again. There must be a problem here when setting path when filetype = 'directory'

mahsashadi avatar Apr 26 '22 05:04 mahsashadi

How do I reproduce ?

andersevenrud avatar Apr 26 '22 18:04 andersevenrud

Imagine a simple component like this, which we want to fill the textbox with the selected directory path

import React, {useEffect, useState} from 'react';

export default function Main({core, proc, win}) {

  const basic =  core.make('osjs/basic-application', proc, win);
  const[sourceData, setSourceData] = useState();

  useEffect(() => {
    basic.on('open-file', (selctedData) => {
      setSourceData(selctedData.path);
    });
  }, []);


  const openBasic = () => {
    basic.createOpenDialog({filetype: 'directory', path:'myMonster:/'});
  };

  return (
    <>
      <label>Source</label>
      <input onClick={openBasic} value={sourceData} />
    </>
  );
}

For example, although I selected d directory inside demo directory, the textbox path does not contain d Screenshot from 2022-04-27 16-14-04

mahsashadi avatar Apr 27 '22 11:04 mahsashadi

Does it work when you go inside the directory ?

andersevenrud avatar May 01 '22 14:05 andersevenrud

Does it work when you go inside the directory ?

Yes, the selected directory is which the user is inside that.

UX-wise I thought when I click on a directory (highlighted in blue), the OK button should be activated and highlighted one should be the selected one.

mahsashadi avatar May 07 '22 08:05 mahsashadi