flathub-infra / linux-store-frontend Goto Github PK
View Code? Open in Web Editor NEWA web application to browse and install applications present in Flatpak repositories. Powers https://www.flathub.org
License: Apache License 2.0
A web application to browse and install applications present in Flatpak repositories. Powers https://www.flathub.org
License: Apache License 2.0
It should be possible to browse themes, runtimes and extensions present in flathub
The first paragraph reads:
"Welcome to Flathub, the home of hundreds of apps which can be easily installed on any Linux distribution. Browse the apps online, from your app center or command line."
It should read:
"Welcome to Flathub, the home of hundreds of apps which can be easily installed on any Linux distribution. Browse the apps online, from your app center, or the command line."
Since we are using the flatpakref files generated at flathub.org, clicking on the Install button doesn't work because of CORS.
We need to configure the nginx server to enable calls from beta.flathub.org, flathub.org and the staging server http://45.55.104.129
This is way too much:
The setup part needn't be included - instead it would be better to link to https://flatpak.org/setup/ , in order to keep all the instructions in one place.
One option might be to have a dialog pop up when install is pressed, like:
It should be /api/v1 and don't specify IP address
http://45.55.104.129/apps/details/com.play0ad.zeroad
flatpak remote-add --if-not-exists flathub https://flathub.org/repo/flathub.flatpakrepo
flatpak install --from http://45.55.104.129/main-store/apps/com.play0ad.zeroad.flatpakref
The second line should be:
flatpak install flathub com.play0ad.zeroad
So I've been going around fixing the appstream data for a few applications and that includes adding 64x64/128x128 icons and while the apps and data do show up the icons never seem to. Example applications:
During discussion in flathub/flathub#250 it became apparent that the user might want to filter the store to only show their architecture (eg arm64).
Use case, I have an arm64 device and want to know which flatpak's will run on my device.
Currently the store shows only x86_64. It should be noted that i386 flatpak's can be installed on a x86_64 host - not sure how this should be indicated to the user? (Could show i386 flatpak's when filtered by x86_64).
What happened:
What I expected to happen:
At step 3 for the same image to be shown as there is only one.
Note: That clicking on the larger screenshot, when there are multiple, cycles through the screenshots.
The title is always the same. It should be set while browsing the webapp
Metrics on chrome with v. 0.4.0 after CONTROL+F5 with clean cache:
Page | Requests | Transferred | Time |
---|---|---|---|
Using flathub | 17 requests | 726 KB transferred | Finish: 1.37 s |
Apps (151apps) | 168 requests | 2.5MB transferred | Finish: 4.42 s (first apps icons appear at 1.46 s) |
App description (0 A.D) | 18 requests | 777 KB transferred | Finish: 1.34 s |
Things that can be done to reduce size:
Just like on Twitter, show a badge for an app being maintained on the store by the official developer.
What happen:
What I expected to happen:
At step 3 to be able to open an app in a new tab
Scenario:
A user is browsing the web frontend and notices multiple apps that seem interesting and they potentially want to install, so that they don't forget or have to search the list again they want to open each interesting app in a new tab. Then once they have found all the apps that are interesting to them they want to view each tab to decide if they want to install the app.
Currently this scenario is tricky as the user has to click on app A, view the page determine if they want it. Then select back, find where they were in the list and then find the next interesting app etc. This causes lots of switching between pages for the user.
https://flathub.org/repo/flathub.flatpakrepo has this:
Icon=https://flatpak.org/img/logo.svg
The webapp should provide this logo
What happened:
What I expected to happen:
At step 3 for the description title and white box to be hidden
Note: I wonder if having no description should even be valid for appstream data ? But this site should protect itself anyway.
0 - http://45.55.104.129/apps/details/io.atom.Atom
1 - http://45.55.104.129/apps/details/com.skype.Client
2 - http://45.55.104.129/apps/details/com.spotify.Client
When you hover over an app tile, a tooltip is shown with the full description. This isn't great for a few reasons - it repeats the description that's already shown above, and it's distracting.
A better solution would be to increase the amount of space for the descriptions in the tiles.
I observed this issue testing the following instance: http://45.55.104.129/home
Please see flathub-infra/flathub.org#31.
The link for "Publish your app" is pointing to https://github.com/flathub/flathub/wiki/Package-Guidelines it appears this should be to https://github.com/flathub/flathub/wiki/App-Submission ? As currently you end up at the root of the wiki.
What happened:
What I expected to happen:
At step for the cursor to change to a pointer. Note that image links do correctly change, and that text links in the install instructions are fine - it is only in the main descriptions.
The page "Using flatpak" should have a link/banner/paragraph with a link to the app list
We should add a Privacy policy page informing about the information collected and how to enable tracking protection
Examples:
The app list is quite long. A scroll back to top button could be useful
What happened:
What I expected to happen:
At step 3 for the applications to be sorted in a case insensitive way. Also the existing flathub site [1] shows all names in title case (first character of each word capitalised) I wonder if this site should be the same? Eg "Tux, of Math Command" becomes "Tux, Of Math Command".
Notice the positioning of darktable and gedit
Notice in the existing site [1] that they are sorted case insensitive (see darktable is inbetween CuteMarkEd and Dconf Editor)
0 - http://45.55.104.129/apps
1 - https://flathub.org/apps.html
On the app pages, the app name is on the left side and the icon is on the right side. Since these two elements are part of the application's identity, they belong together. By convention, the icon should go first, followed by the name.
The apps lists page should let the users browse apps by category
Examples:
I'm not sure what exactly causes this, but the hover effect noticeably lags for me. Logging with Firefox' inspector shows quite a few style recalculations and style changes being applied just when changing the cursor position from one tile to another. Could this be replaced by some on:hover CSS?
Browser: Firefox 58
Installed extensions: Disconnect, uBlock Origin
If you click on one of the app tiles from the home page, while the page loads the footer is shown very briefly at the top - it appears as a brief flash of a black bar.
For example: https://beta.flathub.org/apps/details/com.skype.Client
This is specified as a remote url in the appdata file rather than a normal icon.
Remove unused fonts and/or transfer them compressed
The new designs are fantastic. However, the install instructions take the bigger part of every app page and yet they are all more or less the same. It would be nice if these instructions are collapsed by default and are only shown when the user needs them.
What happened:
What I expected to happen:
At step 5 I expected only the horizontal scrollbar to be visible and for the content not to be limited in height. Note if you switch to "Click to download" the vertical height is actually larger.
In the app details page, the "Install" button uses the File Saver component. Maybe it will work better with a regular link
Right now searching Gimp returns nothing because search only looks in name and summary fields. In this case the name is GNU Image Manipulation Program and summary doesn't mention GIMP
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.