Coder Social home page Coder Social logo

projectcaluma / ember-alexandria Goto Github PK

View Code? Open in Web Editor NEW
3.0 3.0 8.0 4.1 MB

The frontend for the alexandria document management service

License: GNU Affero General Public License v3.0

JavaScript 74.93% HTML 0.95% Handlebars 19.93% SCSS 4.19%

ember-alexandria's People

Contributors

anehx avatar czosel avatar dependabot-preview[bot] avatar dependabot[bot] avatar derrabauke avatar fkm-adfinis avatar johnl17 avatar semantic-release-bot avatar stephanh90 avatar velrest avatar yelinz avatar

Stargazers

 avatar  avatar  avatar

Watchers

 avatar  avatar

ember-alexandria's Issues

Release npm warning

npm WARN publish npm auto-corrected some errors in your package.json when publishing. Please run "npm pkg fix" to address these errors.
npm WARN publish errors corrected:
npm WARN publish "repository" was changed from a string to an object
npm WARN publish "repository.url" was normalized to "git+https://github.com/projectcaluma/ember-alexandria.git"

Card view oddities

Screencast.from.03-06-2024.01.03.56.PM.webm
  • Ctrl click without previous selection does nothing
  • Clicking on card refreshes UI

The clicking on card refreshing prevents the context menu from opening, as well as preventing double clicks.
A rather problematic bug

This only seems to happen with the local development environment.

RFC: Edit document category

Current

Currently there is no way to change the category of a document after it has been uploaded.

Proposal

2 ways of changing the category should be implemented.

  1. In the document detail view (with a modal, which could be reused for the upload button)
  2. Per drag and drop

The drag and drop can be implemented natively or through packages.
Doing it nicely without a package seems like quite a lot of effort.

There are some popular packages available, but not quite sure if they are a good choice:
Very solid, but no longer maintained
https://www.npmjs.com/package/dragula
Low level, somewhat maintained
https://www.npmjs.com/package/@shopify/draggable
Similar to above
https://www.npmjs.com/package/interactjs

uk-sortable doesnt seem fit for this kind of job

Just asking for some opinion as Im not sure what would be a good choice for the drag and drop.

@anehx @czosel @derrabauke

Delete multiple keeps sidebar open

After selecting multiple and deleting the sidebar is not closed. The document query parameter persists and causes an error, because the document no longer exists.

Expired download URL

The frontend should know when a download url is expired (by parsing the expiry query parameter).
If its expired it can try to refetch a new download url. Otherwise the user would have to reload the page/ do something to refresh the document list.

Sort categories

Categories should be sorted by a custom order the admin defines

missing refresh after replacing document

After replacing a document, the download options are missing a refresh, i.e. the old, replaced document is downloaded.

  • add a document
  • replace the document with a different one
  • -> the new document is shown in versions/history
  • -> the download button (in the tiles view and also the button himself) is not refreshed, pointing to the old document

Side-panel should be redesigned for multiple document selection

Summary

The side panel as it is today works relatively well for single document selection. However, for the selection of multiple documents there are some problems. It also produces some UX problems. It is proposed, that the side-panel should be refactored into its own component that is decoupled in its state from the document selection.

Problems

These are imo the main issues with the side panel today:

  1. Closing the document panel works by navigating to the current route and resetting the document param. If the document or documents param is reused for multiple selection this would mean that closing the side bar would deselect all documents. This is pretty poor from a UX point of view.
  2. The side panel automatically opens on document selection. In the grid view this means that the documents shuffle around which is bad UX.

Proposed solution

Decouple the side-bar from the document query param and make it its own independent UI component.

This would have the advantages that:

  1. users could toggle its state using a button (show/hide)
  2. the state of the side panel could be reflected as a url param, ex. side-panel=true
  3. selecting/deselecting documents does not open/close the side bar repeatedly. Instead the contents of the side-panel get updated to reflect a single document selection or a multiple document selection.

Ideas

I have started to implement this with a toggle button:
image

ToDos:

  • Refactor and extract the tag manager into its own component to allow it to work for both single and multiple documents

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.