os-js / osjs-client

OS.js Client Module
https://manual.os-js.org/
Other
31 stars 31 forks source link

An open dialog for directories #154

Open mahsashadi opened 3 years ago

mahsashadi commented 3 years ago

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?

andersevenrud commented 3 years ago

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 commented 3 years ago

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

mahsashadi commented 3 years ago

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 commented 2 years ago

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'

andersevenrud commented 2 years ago

How do I reproduce ?

mahsashadi commented 2 years ago

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

andersevenrud commented 2 years ago

Does it work when you go inside the directory ?

mahsashadi commented 2 years ago

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.