Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Explorer: indicate symlinks #11539

Closed
bpasero opened this issue Sep 5, 2016 · 23 comments · Fixed by #43815
Closed

Explorer: indicate symlinks #11539

bpasero opened this issue Sep 5, 2016 · 23 comments · Fixed by #43815
Assignees
Labels
feature-request Request for new features or functionality file-explorer Explorer widget issues on-testplan release-notes Release notes issues
Milestone

Comments

@bpasero
Copy link
Member

bpasero commented Sep 5, 2016

I think this should be done via icons.

@bpasero bpasero added feature-request Request for new features or functionality file-explorer Explorer widget issues labels Sep 5, 2016
@bpasero bpasero added this to the Backlog milestone Sep 5, 2016
@niieani
Copy link

niieani commented Nov 16, 2016

It might be better if a symlink is highlighted in a different way than an icon, perhaps with color, or a second icon? Cause icons indicate the file type, but a symlink only indicates the file isn't actually there. It would be a very useful feature, especially for larger projects.

@bpasero bpasero removed this from the Backlog milestone Nov 17, 2016
@PKief
Copy link

PKief commented Feb 7, 2017

Is there already a way to add an icon for symlinks?
I am a creator of an icon theme and would like to add an icon for this.

@snoopdouglas
Copy link

snoopdouglas commented Mar 8, 2017

For reference, that other trendy text editor does it with icons like this.

In this example hosts and httpd.conf are symlinks, hyper.js is not:

screen shot 2017-03-08 at 09 08 45

@coolgod
Copy link

coolgod commented Nov 11, 2017

any further progress on this feature request?
this is useful when working on several related npm packages using npm link command. another example would be a lerna repo. it would be pretty obvious to figure out the symlinked relationships under the node_modules folder for a dependency tree.

@daniell0gda
Copy link

I have situation that I am linking some folders from sub-project. Before I was linking I was using bat file to copy files and I thought that simply linking is awesome idea. Problem was that after a while I don't know if folder was linked and that makes me really sad 👎

@jimblue
Copy link

jimblue commented Feb 3, 2018

Any news about a fix? It's a very old and expected feature!

@jimblue
Copy link

jimblue commented Feb 3, 2018

Adding a symlink icon to concerned files and folder seems the best approach. Or maybe an highlight colour.

Your input on this @isidorn ?

@ryansully
Copy link

I like @snoopdouglas's example, but rather than replace the icon completely, maybe it could preserve the icon for that file type but overlay the icon from the example as a badge overlay in the corner?

@snoopdouglas
Copy link

snoopdouglas commented Feb 4, 2018 via email

@jimblue
Copy link

jimblue commented Feb 4, 2018

Agree a symlink icon as badge overlay would be the best solution.

@isidorn
Copy link
Contributor

isidorn commented Feb 5, 2018

We would need to add two properties to icon themes
symbolicLink
symbolicLinkExpanded

Root folders are already doing this, here's an example

It would need to be added to this interface and the FileKind would need to be expanded to contain SymbolicLink.
The explorer passes this information to he label decorator here

The only missing piece is how to check if stat is symbolic link. For that the fileService would need to expose the node isSymbolicLink()

@bpasero if the outline of the work makes sense to you could you expose this in the FileService and I can adopt it in all the other places I mentioned above.

Also we would need @chryw to provide some nice icons for symbolic links. So same as for the root folders previously we would need 6 icons (seti theme does not indicate folders):

  • Symlink expanded dark theme
  • Symlink not expanded dark theme
  • Symlink expanded light theme
  • Symlink not expanded light theme
  • Seti Symlink light theme
  • Seti Symlink dark theme

So with this I propose to use the same icon for symbolic link files and folders, the only difference would be the chevron used to expand.
Also a symbolic link icon would take priority over a file type icon. So if a symlink is hello.js it would use the symbolic link icon, not the javascript icon.

For reference here are the other folder icons which we use for our default icon theme.

@bpasero
Copy link
Member Author

bpasero commented Feb 6, 2018

@isidorn keep in mind that symbolic links can both be files or folders, so I am not sure what to do about files that are symbolic links. Would you drop the normal file icon and show a generic symbolic link icon instead? It almost seems like a theme author would maybe want to have an overlay over each file icon to indicate that it is a symbolic link.

As for the file service: we can add it, however isSymbolicLink is only working if fs.lstat is used (instead of fs.stat, see explanation). lstat will return the metadata of the link itself, not its target. We would have to add this call after the fs.stat call here and probably also here.

The downside is that we need both stat and lstat because lstat would return false for isDirectory for a symbolic link that points to a folder.

Another idea that would probably work without having to call both methods:

  • first do a fs.lstat
  • if isSymbolicLink is false, we can use the information as is
  • otherwise we call fs.stat to ensure we get the right metadata

Maybe we could just add this to extfs and pfs to make it easier to adopt in the file service (something like extfs.stat that returns the stat object (via fs.stat) and a boolean if the file is a symbolic link or not).

If you want to sketch this out in a PR, I can do a review.

@isidorn
Copy link
Contributor

isidorn commented Feb 6, 2018

@bpasero yes I would start with the symbolic link icon having priority (from the screenshot above it seems like other editors are doing this). Otherwise we would need to beef up our icon themes for the overlay. Fyi @aeschli

I will sketch out a PR. Thanks for the pointers and explanations!

@isidorn isidorn modified the milestones: On Deck, February 2018 Feb 6, 2018
@aeschli
Copy link
Contributor

aeschli commented Feb 7, 2018

I agree we need an overlay. Users can have different icons per folderName as well as per filename, extension, language.

@bpasero
Copy link
Member Author

bpasero commented Feb 7, 2018

@isidorn @aeschli maybe an alternative solution would be to use an explorer decoration instead of tampering with the icon. One thing to keep in mind is that the icon would only indicate symlinks in the files explorer but nowhere else, so I think going with the icon might actually not be such a good idea.

@isidorn
Copy link
Contributor

isidorn commented Feb 7, 2018

@bpasero to start I can just color it in a differnt color, and maybe contribute some hover text.
As to how to exactly show it we can also discuss in ux meeting / standup

As for the icon not being a good idea, I am not sure the users would want to know if something is a symlink when it is opened in the quick open. For me it does not really belong there.
Imho explorer is the place to show this information. Now in which way I am not 100% sure

@jimblue
Copy link

jimblue commented Feb 7, 2018

👍 for different color!!! easy and enough!!

@bpasero
Copy link
Member Author

bpasero commented Feb 7, 2018

@isidorn yeah good point, but then it should be an overlay as @aeschli suggests which is probably more work

Don't think a different color would work since it collides with git decorations and problems.

@chryw
Copy link
Contributor

chryw commented Feb 8, 2018

@bpasero @isidorn should I make a tiny symlink overlay icon in svg without color (#000000), and let the code handle color changing?
Symlink_overlay.zip

BTW this is our usual symlink file icon -
image

SymlinkFile_16x_vscode.zip

@Kroc
Copy link

Kroc commented Feb 26, 2018

Does this indicate hard-links on Windows? Even though hard-links are supposed to be entirely transparent, you can easily confuse yourself if you edit a file in one folder and unexpected changes are occurring in another folder. Whilst the presence / use of hard-links are rare on Windows, they do exist and recent versions of Git allow the use of hard-linking where before soft-links were used.

@isidorn isidorn added the release-notes Release notes issues label Mar 2, 2018
@netpoetica
Copy link

netpoetica commented Apr 2, 2018

From what I can see, symlinks do not show up in File Explorer at all - am I missing something? Let alone having a nice icon next to them or colorization, they just are not present

EDIT: hard links are visible, but symlinks are not

@PKief
Copy link

PKief commented Apr 2, 2018

@netpoetica The feature was shipped with the latest release of VS Code. Symlinks are indicated with the small arrow on the right side in the explorer:

image

The arrow is activated by default.

Maybe you should refresh the explorer or restart your VS Code instance. Make sure that you've installed the latest version of VS Code (1.21.1).

@netpoetica
Copy link

I think for folders yes, but if it is a symlinked file, I do not see it in VSCode.

In my case, I have one file inside of a folder:

src/
-> myfile.js

and then I create a soft link

ln -s myfile.js myotherfile.js

myotherfile.js is not present in VSCode, even after refresh, close or open

@vscodebot vscodebot bot locked and limited conversation to collaborators Apr 7, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
feature-request Request for new features or functionality file-explorer Explorer widget issues on-testplan release-notes Release notes issues
Projects
None yet
Development

Successfully merging a pull request may close this issue.