Vscode: Explorer: indicate symlinks

[bpasero]

I think this should be done via icons.

[niieani]

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.

[PKief]

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]

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:

[coolgod]

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]

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]

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

[jimblue]

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

Your input on this @isidorn ?

[ryansully]

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]

I agree, an overlay would be even better. A tooltip Indicating the link
target would be a good idea too

On 4 Feb 2018 07:50, "Ryan Sullivan" [e-mail] wrote:

I like @snoopdouglas https://github.com/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?

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/Microsoft/vscode/issues/11539#issuecomment-362887903,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AEqnnucJVnNnW_UoTg5O33I66qjG2Sjnks5tRWFLgaJpZM4J0_1B
.

[jimblue]

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

[isidorn]

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]

@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]

@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!

[aeschli]

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

[bpasero]

@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]

@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]

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

[bpasero]

@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]

@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 -

SymlinkFile_16x_vscode.zip

[Kroc]

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.

[netpoetica]

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]

@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:

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]

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