moose icon indicating copy to clipboard operation
moose copied to clipboard

Show download button only for the OS of the client-device.

Open agent515 opened this issue 4 years ago • 10 comments

Fix #236 Using platform.js to detect OS at the client-side, only display the corresponding button and Github-repo-link.

agent515 avatar Feb 03 '21 07:02 agent515

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: https://vercel.com/ritz078/moose/9sp24l5uu
✅ Preview: https://moose-git-fork-agent515-download-link.ritz078.now.sh

vercel[bot] avatar Feb 03 '21 07:02 vercel[bot]

It detects my mac to be a linux.

ritz078 avatar Feb 03 '21 07:02 ritz078

In my machine, it is showing windows and Linux button (instead of github) on vercel only. local looks fine.

image

agent515 avatar Feb 03 '21 07:02 agent515

platform.js might be buggy

ritz078 avatar Feb 03 '21 07:02 ritz078

platform.js might be buggy

Ohh, should I use different package or try out different versions? I tried react-device-detect, it wasn't working properly either. Do you know a reliable package?

agent515 avatar Feb 03 '21 07:02 agent515

Why not use platform.os instead of matching string?

Also, if it doesn't match any platform, we should show all the options.

ritz078 avatar Feb 04 '21 11:02 ritz078

Why not use platform.os instead of matching string?

It is an object. So, converted into a string to use regex.

Also, if it doesn't match any platform, we should show all the options.

image

When I comment out GitHub-link, Mac link looks fine. I am not able to understand what's causing this problem.

image

I have made some changes still couldn't resolve that issue. Making some pushes to see if anything is improved.

agent515 avatar Feb 06 '21 13:02 agent515

It is an object. So, converted into a string to use regex.

In that case you can use platform.os.family ?

When I comment out GitHub-link, Mac link looks fine. I am not able to understand what's causing this problem.

Can you try adding a unique key prop to all the DownloadButton components ?

See https://kentcdodds.com/blog/understanding-reacts-key-prop

Also I am thinking that we should have other links too in case someone wants to download a build of other platform.

Screenshot 2021-02-07 at 12 58 53 AM

In the above image "Download for other platforms" is a button. If you click on it, all the links show up. WDYT ?

ritz078 avatar Feb 06 '21 19:02 ritz078

In that case you can use platform.os.family ?

Yeah, this way seems more appropriate.

Can you try adding a unique key prop to all the DownloadButton components ?

I'll try this out.

Also I am thinking that we should have other links too in case someone wants to download a build of other platform.

Screenshot 2021-02-07 at 12 58 53 AM

In the above image "Download for other platforms" is a button. If you click on it, all the links show up. WDYT ?

I agree. This is a better UI/UX.

I'll make those changes and will let you know.

agent515 avatar Feb 07 '21 03:02 agent515

closed by mistake.

ritz078 avatar Feb 12 '21 07:02 ritz078