Open Mehrabbruno opened 2 years ago
done
Design - Bookmarked pop-over (toggles on onClick) - 1min
done
pop-over header (fixed to the top and contains bookmarked title, total number of bookmarked tabs and close button) - 1min
done
Bookmarks container (contains application logo, title, and remove button) - 1min
done
Search input (contains search icon, inputField and close icon when added text) - 1min
done
Record an explanatory video for Bookmars Popover Component and add it in the header description - 1min
@output
๐ฆ bookmarksPopover_v0.0.1
feedback 2022.10.22
This one for bookmarks should look like a file explorer with the current bookmark highlighted.
done
Design - bookmarksPopover_v0.0.2 - 20min
done
remove header, and footer from the component.done
place the content inside the #125 content body@output
๐ฆ bookmarksPopover_v0.0.2
feedback 2022.10.31
Regarding the bookmark and how i imagine it, i recorded a short screencast https://share.vidyard.com/watch/MjmwyDuz7o386C4MwZE12n?
But I assume what you are referring to is the issue that one single "bookmark" or in general any file or folder that is "symlinked" under more than one folder, but also all the entries inside a "tile json" file themselves, they can have "multiple parents"
In that case - there is already a solution that i have been working on with david for quite some time now, but in the context of something we call a task messegner
which is actually the wireframes for the tool or app that is supposed to replace our github/youtube workflow in the future.
In essence it looks and works like the following:
---------------------------------------
FILE EXPLORER:
---------------------------------------
๐ฐโฌ๐root
โ๐โฌ๐๏ธ๐งuser
โ๐โฌ๐๏ธ๐ชฆtomb
โ โ๐โ๐๏ธrepo3
โ โ๐โฌ๐org3
โ โ๐โ๐๏ธrepo1
โ
โ๐โ๐๏ธ๐๏ธrepo1
โ๐โ๐๏ธ๐๏ธuser
โ
โ โโ๐โ๐orgX
โ โ๐๐งuser
โ๐โผ๐๏ธ๐org1
โ โ๐โ๐๏ธ๐ชฆtomb
โ โ๐โ๐๏ธ๐๏ธorg1
โ โ๐โ๐๏ธ๐๏ธrepo1
โ
โ๐โฌ๐๏ธโ๐๏ธ๐org2
โ๐โ๐๏ธ๐ชฆtomb
โ๐โ๐๏ธ๐๏ธrepo1
โ๐โ๐๏ธ๐๏ธrepo2
โ๐โ๐๏ธ๐๏ธorg2
โ๐โฌ๐๏ธ๐org2a
โ โ๐โ๐๏ธ๐ชฆtomb
โ โ๐โ๐๏ธ๐๏ธrepo1
โ โ๐โ๐๏ธ๐๏ธrepo2
โ๐โฌ๐๏ธ๐org2b
โ๐โ๐๏ธ๐ชฆtomb
โ โโ๐โ๐๏ธ๐๏ธorgA
โ โโ๐โ๐๏ธ๐๏ธorgB
โ โโ๐โ๐๏ธ๐๏ธorgC
โ โโ๐โ๐๏ธ๐๏ธorgD
โ๐โผ๐๏ธ๐๏ธrepo1
โ๐โผ๐ties
โ๐โผ๐ring
โ โโ๐โ๐๏ธ๐๏ธrepoZ/๐package.json
โ โ๐โ๐๏ธ๐๏ธrepo2#12/๐package.json
โ๐โผ๐๐package.json
โ โ๐โ๐๏ธ๐๏ธrepo1
โ โโ๐โ๐๏ธ๐๏ธrepoY
โ๐โ๐๏ธ๐README.md
โ๐โ๐๏ธ๐index.htm
โ๐โ๐src
---------------------------------------
BOOKMARKS:
---------------------------------------
๐งฒ๐โฌ๐๏ธorg2b
โ โโ๐โ๐๏ธ๐๏ธorgA
โ โโ๐โ๐๏ธ๐๏ธorgB
โ โโ๐โ๐๏ธ๐๏ธorgC
โ โโ๐โ๐๏ธ๐๏ธorgD
โ๐โผ๐๏ธ๐๏ธrepo1
โ๐โผ๐ties
โ๐โผ๐ring
โ โโ๐โ๐๏ธ๐๏ธrepoZ/๐package.json
โ โ๐โ๐๏ธ๐๏ธrepo2/๐package.json
โ๐โผ๐๐package.json
โ โ๐โ๐๏ธ๐๏ธrepo1
โ โโ๐โ๐๏ธ๐๏ธrepoY
โ๐โ๐๏ธ๐README.md
โ๐โ๐๏ธ๐index.html
โ๐โ๐src
---------------------------------------
โโ๐โ๐๏ธ๐orgX
โ๐๐งuser
๐งฒ๐โผ๐๏ธ๐org1
โ๐โ๐๏ธ๐๏ธrepo1
---------------------------------------
โ๐ฐโฌ๐root
โ โ๐๐งuser
๐งฒ๐โผ๐๐งuser
โ๐โ๐๏ธ๐๏ธrepo1
โ๐โ๐๏ธ๐๏ธuser
โ โโ๐โ๐๏ธorgX
โ โ๐๐งuser
โ๐โผ๐org1๐
โ โ๐โ๐๏ธrepo1
โ๐โฌ๐๏ธโ๐๏ธorg2
---------------------------------------
This is not the latest or fully featured or perfect example. We use it so it is terminal compatible and works purely with emojis too.
Now regardless of how this could be nicer themed or improved by using a better set of icons or changing the formatting slightly, the main feature is, that each entry can potentially be expanded in 2 directions.
Depeding on where you started (e.g. a bookmark (= ๐งฒ) or the normal file exporer, there is always one main line of expansion.
The difference can be seen in the following example coped from above:
โ๐ฐโฌ๐root
โ โ๐๐งuser
๐งฒ๐โผ๐๐งuser
โ๐โ๐๏ธ๐๏ธrepo1
...
vs.
๐ฐโฌ๐root
โ๐โฌ๐๏ธ๐งuser
โ ...
โ๐โ๐๏ธ๐๏ธrepo1
...
B is the main file explorer, so root/user
is a sub folder and root/user/repo1
is a sub sub folder.
But in bookmark A it starts with user
, so user/repo1
is a sub folder, but user\root
is a super folder
This means, you can technically expand in endless loops.
If /
means sub folder
and \
means super folder
you could go root/user/repo1\user/repo1\user\root/user/repo1\user/....
But the ๐
icon always appears in front of an icon when the visible item, e.g.
โ๐๐งuser
is already expanded and visible in the current structure, so the user knows they are now starting to expand in a loop if they continue - which they might anyway for temporary convenience reasons or whatever... it is up to them.
So it is easy to choose an emoji for links
and for tile json files
and then add those types of entries to the above structure, but use the same expansion mechanism that allows to go in both directions.
36min
I agree that the design look similar to the file explorer popover but the functionality of the bookmark popover is different.
html files
. and in that folder they will place the .html files as bookmarked. The folder which the user created are represented with the image below. When the user click html files
tab here, they will get the bookmarkPopover containing only the files that they have bookmarked. nothing else, because that's what all they care about. easy accessibility to the specific files they care about. not what around that or the parent folder.
feedback 2022.11.05
Beinb able to know the parents of a bookmarked issue is important and the main issue why we can't re-use an existing file explorer component.
The problems with traditional file explorer components
My main *need is, that when any bookmark is shared with me (e.g. a link to a github issue or even a website, i want to know what are the parents.
If somebody shares with me a link, i can literally see the file/folder it is under, imagine you see a link like:
./dashboard.html
....
or
./user/work/my-projects/tesla//design/roadster/dashboard.html
The latter gives you a lot of context precisely because you know the file path which shows you the parents.
I also can easily switch my bookmark from ./dashboard.html
to
./tesla
if i want the project to be bookmarked instead(but only if clicking on the popover for dashboard.html
shows me also the parent(s) :-)
So please, the requirement is to:
dashboard.html
is also bookmarked/symlinked under ./user/work/presentations/2022.11.15/meeting-with-musk/dashboard.html
In fact - the entire tiling window manager is in part targeting developers who mainly use a terminal - and should ideally work in a computer terminal (in a shell, like "bash") too
As you said - those "files" belong to different "destinations" (in the whole root directory)
You talk about an example with html files all bookmarked under a special ./HTML Files/
folder somewhere
So look at the path /root/user/org2/org2b/repo1/
for example.
You can see it has orgA
, orgB
, orgC
and orgD
as a parent.
So imagine repo1
was instead /root/user/org2/org2b/repo1.html
So you could see that this html file is bookmarked or linked under those 4 orgs.
But it could easily also show one more parent, which would be ./html
./HTML Files/
folder you see all html files quickly../HTML Files/
folder tooIt is exactly the use case I want to solve and make things more easily visible.
What do we care about?
What we care about depends on our use case - basically our "query" to the "database". It depends on what we wanna know... So in the scenario where you say you only care about the html files and nothiner else. => The answer is to just not expand the parents :-)
Imagine the bookmark bar shows HTML Files
and other bookmarks (5 in total), e.g.
๐งฒ๐ฐโ๐user
๐งฒ๐โ๐๏ธHTML Files
๐งฒ๐โ๐๏ธtesla
๐งฒ๐โ๐๏ธpresentations
๐งฒ๐โ๐๏ธdocuments
Imagine the file explorer would look like this:
๐งฒ๐ฐโฌ๐user
โ๐โฌ๐๏ธwork
โ โ๐โฌ๐๏ธmy-projects
โ โ๐โฌ๐๏ธfiles
โ โ โ๐โฌ๐๏ธHTML Files
โ โ โ๐โ๐๏ธdashboard.html
โ โ โ๐โ๐๏ธdashboard.html
โ โ๐โฌ๐๏ธtesla
โ โ โ๐โฌ๐๏ธdesign
โ โ โ๐โ๐๏ธdashboard.html
โ โ โ๐โฌ๐๏ธmodelX
โ โ โ โ๐โ๐๏ธdashboard.html
โ โ โ๐โฌ๐๏ธmodelY
โ โ โ โ๐โ๐๏ธdashboard.html
โ โ โ๐โฌ๐๏ธroadster
โ โ โ๐โ๐๏ธdashboard.html
โ โ๐โฌ๐๏ธpresentations
โ โ๐โฌ๐๏ธ2022.11.15
โ โ๐โฌ๐๏ธmeeting-with-musk
โ โ๐โ๐๏ธdashboard.html
โ๐โฌ๐๏ธdocuments
โ๐โฌ๐๏ธHTML Files
โ๐โ๐๏ธdashboard.html
โ๐โ๐๏ธdashboard.html
๐งฒ๐โ๐๏ธHTML Files
๐งฒ๐โ๐๏ธtesla
๐งฒ๐โ๐๏ธpresentations
๐งฒ๐โ๐๏ธdocuments
First - Should the above be allowed?
Or when you link 2 HTML files from different location, but both e.g. called index.html
into the same bookmark folder, would you be forced to give the linked version a different name, e.g. indexA.html->index.html
so that it doesn't have multiple times the same name in one folder?
Second
/user/documents/HTML Files
you see all HTML files you have/user/work/my-projects/tesla/files/HTML Files
you see all tesla html files/user/work/presentations/2022.11.15/meeting-with-musk
you see all relevant html filesBut would you know which file is which in terms of overview?
dashboard.html
file?dashboard.html
file?/user/documents/HTML Files/dashboard.html
file, is it gone forever or was it just a link and still exists in another folder?./modelY/dashboard.html
, will that affect meeting-with-musk?Your use cases is solved by seeing the popover look like this.
This shows exactly what you want, only the HTML Files you care about, nothing else, just like you want it. Your bookmark bar has 5 entries and you open the popover for HTML Files
and you only see the HTML Files inside it. Isn't that great?!? :-)
๐งฒ๐ฐโ๐user
๐งฒ๐โฌ๐๏ธHTML Files
โ๐โ๐๏ธdashboard.html
โ๐โ๐๏ธdashboard.html
โ๐โ๐๏ธdashboard.html
๐งฒ๐โ๐๏ธtesla
๐งฒ๐โ๐๏ธpresentations
๐งฒ๐โ๐๏ธdocuments
my use case is solved by enabeling me to expand HTML files
or a specific html file
๐งฒ๐ฐโ๐user
๐งฒ๐โฌ๐๏ธHTML Files
โ โ๐HTML Files
โ โ โ๐โ๐๏ธdocuments
โ โ๐โด๐๏ธHTML Files
โ โ๐โ๐๏ธroadster
โ โ๐โ๐๏ธmeeting-with-musk
โ๐โด๐dashboard.html
โ โ๐HTML Files
โ โ โ๐โ๐๏ธdocuments
โ โ๐โด๐๏ธHTML Files
โ โ๐โ๐๏ธmodelY
โ โ๐โ๐๏ธmodelX
โ โ๐โ๐๏ธdesign
โ๐โ๐๏ธdashboard.html
๐งฒ๐โ๐๏ธtesla
๐งฒ๐โ๐๏ธpresentations
๐งฒ๐โ๐๏ธdocuments
so actually, now i know from that already what my bookmark ๐งฒ๐โฌ๐๏ธHTML Files
is,
and if i expand it i know now.
๐ฐโ๐user
โ๐ฐโฌ๐user
โ โ๐โฌ๐๏ธdocuments
๐ โ โ๐โ๐๏ธHTML Files <-- click here to channge pinned bookmark to this!
โ๐โด๐๏ธwork
โ๐โด๐๏ธmy-projects
โ๐โด๐๏ธfiles
๐งฒ๐โผ๐๏ธHTML Files
โ โ๐HTML Files
โ โ โ๐โ๐๏ธdocuments
โ โ๐โด๐๏ธHTML Files
โ โ๐โ๐๏ธroadster
โ โ๐โ๐๏ธmeeting-with-musk
โ๐โด๐dashboard.html
โ โ๐HTML Files
โ โ โ๐โ๐๏ธdocuments
โ โ๐โด๐๏ธHTML Files
โ โ๐โ๐๏ธmodelY
โ โ๐โ๐๏ธmodelX
โ โ๐โ๐๏ธdesign
โ๐โด๐๏ธdashboard.html
๐งฒ๐โ๐๏ธtesla
๐งฒ๐โ๐๏ธpresentations
๐งฒ๐โ๐๏ธdocuments
๐งฒ๐ฐโ๐user
โ๐ฐโ๐user
โ๐โด๐๏ธdocuments
๐งฒ๐โผ๐๏ธHTML Files
โ โ๐HTML Files
โ โ โ๐โ๐๏ธdocuments
โ โ๐โด๐๏ธHTML Files
โ โ๐โ๐๏ธroadster
โ โ๐โ๐๏ธmeeting-with-musk
โ๐โด๐dashboard.html
โ โ๐HTML Files
โ โ โ๐โ๐๏ธdocuments
โ โ๐โด๐๏ธHTML Files
โ โ๐โ๐๏ธmodelY
โ โ๐โ๐๏ธmodelX
โ โ๐โ๐๏ธdesign
โ๐โด๐๏ธdashboard.html
๐งฒ๐โ๐๏ธtesla
๐งฒ๐โ๐๏ธpresentations
๐งฒ๐โ๐๏ธdocuments
You see how now you changed your bookmarks from ./my-projects/files/HTML Files/
to /user/documents/HTML Files/
:-)
@todo
115
@input
๐ฆpopOvers_v0.0.1 (Deprecated)
from #113@output
๐ฆbookmarksPopover_v0.0.1
fromcomment
@input
๐ฆbookmarksPopover_v0.0.1
@input
๐ฆpopoverContainer_v0.0.1
from #125@output
๐ฆbookmarksPopover_v0.0.2
fromcomment
@input
๐ฆbookmarksPopover_v0.0.2
@output
โbookmarksPopover_v0.0.3
@info
This pop-over is designed for to be placed in component
Design TWM - bookmarksContainer_v0.0.1