feat(taglist): show size with a decimal for images between 1 and 10

fixes #276

CONTRIBUTING.md

@@ -0,0 +1,51 @@
+# How to contribute to Docke Registry UI
+
+I ([Jones Magloire](https://joxit.dev/)) created the Docker Registry UI from scratch, but I can't succeed without contributions from community members like you! Contributions come in many different shapes and sizes. In this file we provide guidance around two of the most common types of contributions: opening issues and opening pull requests.
+
+Please read also the [Code Of Conduct](https://github.com/Joxit/docker-registry-ui/blob/main/CODE_OF_CONDUCT.md).
+
+## Submitting Issues
+
+### Did you find a bug?
+
+* **Ensure the bug was not already reported** by searching on GitHub under [Issues](https://github.com/joxit/docker-registry-ui/issues).
+
+* If you're unable to find an open issue addressing the problem, [open a new one](https://github.com/joxit/docker-registry-ui/issues/new). Be sure to
+  * Use the [**Bug Report Template**](https://github.com/Joxit/docker-registry-ui/issues/new?assignees=&labels=&template=bug_report.md&title=)
+  * Include a **title and clear description**
+  * Write as much relevant information as possible
+  * Add your **full configuration** (Docker Registry UI **AND** Docker Server) or a **screenshots** demonstrating the expected behavior that is not occurring
+
+## Submitting Pull Request
+
+### Do you intend to add a new feature or change an existing one?
+
+* Suggest your change in a new issue using the [**Feature Request Template**](https://github.com/Joxit/docker-registry-ui/issues/new?assignees=&labels=&template=feature_request.md&title=) and start writing code.
+
+* Run the interface on your computer first with `npm start`.
+
+### Did you write a patch that fixes a bug?
+
+* Open a new [GitHub pull request](https://github.com/Joxit/docker-registry-ui/compare) with the patch.
+
+* Ensure the PR description clearly describes the problem and solution. Include the relevant issue number if applicable.
+
+* Before submitting, please read the [Coding conventions](#coding-conventions) first.
+
+### Did you fix whitespace, format code, or make a purely cosmetic patch?
+
+Changes that are cosmetic in nature and do not add anything substantial to the stability, functionality, or testability of Docker Registry UI will generally not be accepted.
+
+## Coding conventions
+
+* I use prettier with custom preset, use `npm format` before any PR
+
+* I use [semver](https://semver.org/) for package versioning
+
+* I use Github Actions for publishing docker images and releases
+
+* I indent with two spaces
+
+Thank you for your help! :heart:
+
+[Joxit](https://joxit.dev/)

CONTRIBUTORS.md

@@ -39,3 +39,7 @@
 - Jason Tackaberry [@jtackaberry](https://github.com/jtackaberry)
 - Maxime Loliée [@loliee](https://github.com/loliee)
 - Enrico [@Enrico204](https://github.com/Enrico204)
+- [@clyvari](https://github.com/clyvari)
+- Laszlo Boros [@Semmu](https://github.com/Semmu)
+- [@JKDingwall](https://github.com/JKDingwall)
+- Martin Herren [@MartinHerren](https://github.com/MartinHerren)

README.md

@@ -85,7 +85,10 @@ If you like my work and want to support it, don't hesitate to [sponsor me](https
     - This a docker registry API limitation, there is only one way to [delete images with tag](https://docs.docker.com/registry/spec/api/#deleting-an-image), it's by its `name` and its `manifest` (it's a sha of the content). So when you delete a tag, this will delete all tags of this image with the same SHA/manifest.
 -   Can I run the container with an unprivileged user ?
     - Yes you can run the container with the `nginx` user, (see [#224](https://github.com/Joxit/docker-registry-ui/issues/224)).
-
+-   Can I use the UI with a docker hub mirror and show `library/*` images ?
+    - Yes but it is at your own risk using two regstry servers, check the comment [#155](https://github.com/Joxit/docker-registry-ui/issues/155#issuecomment-1286052124).
+-   How to fix CORS issue on s3 bucket ?
+    - You should add a CORS Policy on your bucket, check the issue [#193](https://github.com/Joxit/docker-registry-ui/issues/193).
 
 Need more informations ? Try my [examples](https://github.com/Joxit/docker-registry-ui/tree/main/examples) or open an issue.
 

nginx/default.conf

@@ -26,6 +26,7 @@ server {
 #!        if ($http_user_agent ~ "^(docker\/1\.(3|4|5(?!\.[0-9]-dev))|Go ).*$" ) {
 #!            return 404;
 #!        }
+#!        proxy_http_version 1.1;
 #!        ${NGINX_PROXY_HEADERS}
 #!        ${NGINX_PROXY_PASS_HEADERS}
 #!        proxy_pass ${NGINX_PROXY_PASS_URL};

package.json

@@ -1,6 +1,6 @@
 {
   "name": "docker-registry-ui",
-  "version": "2.3.0",
+  "version": "2.3.3",
   "scripts": {
     "format": "npm run format-html && npm run format-js && npm run format-riot",
     "format-html": "find src rollup rollup.config.js -name '*.html' -exec prettier --config .prettierrc -w --parser html {} \\;",

src/components/tag-list/pagination.riot

@@ -18,10 +18,11 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
   <div class="conatianer">
     <div class="pagination-centered">
       <material-button
+        aria-label="page-{ p.page }"
         waves-color="rgba(158,158,158,.4)"
-        each="{p in props.pages}"
+        each="{ (p, idx) in props.pages}"
         class="{ p.current ? 'current' : ''} { p['space-left'] ? 'space-left' : '' } { p['space-right'] ? 'space-right' : ''}"
-        onClick="{() => props.onPageUpdate(p.page)}"
+        onClick="{() => props.onPageUpdate(idx)}"
       >
         <i if="{ p.icon }" class="material-icons">{ p.icon }</i>
         <div if="{ !p.icon }">{ p.page }</div>

src/components/tag-list/tag-list.riot

@@ -125,7 +125,9 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
         state.asc = true;
       },
 
-      onPageUpdate(page) {
+      onPageUpdate(idx) {
+        const labels = getPageLabels(this.state.page, getNumPages(this.state.tags));
+        const page = labels[idx].page;
         this.update({
           page: page,
         });

src/scripts/utils.js

@@ -8,7 +8,12 @@ export function bytesToSize(bytes) {
     return '0 Byte';
   }
   const i = parseInt(Math.floor(Math.log(bytes) / Math.log(1024)));
-  return Math.ceil(bytes / Math.pow(1024, i)) + ' ' + sizes[i];
+  const number = bytes / Math.pow(1024, i);
+  if (number < 10) {
+    const decimal = (bytes - Math.floor(number) * Math.pow(1024, i)) / Math.pow(1024, i);
+    return `${Math.floor(number)}.${Math.floor(decimal * 10)} ${sizes[i]}`;
+  }
+  return Math.ceil(number) + ' ' + sizes[i];
 }
 
 export function dateFormat(date) {