-
-
Notifications
You must be signed in to change notification settings - Fork 1.3k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Feature/nextcloud widgets #740
Conversation
Add a widget supporting the `capabilites`, `user` and `serverinfo` Nextcloud APIs. Basic branding, user and quota information is always displayed and when the provided credentials are for and admin user then server information is also displayed. APIs: * [capabilities](https://docs.nextcloud.com/server/latest/developer_manual/client_apis/OCS/ocs-api-overview.html#capabilities-api) * [user](https://docs.nextcloud.com/server/latest/developer_manual/client_apis/OCS/ocs-api-overview.html#user-metadata) * [serverinfo](https://github.com/nextcloud/serverinfo)
plus * some template and style tweaking * improve tooltips * enforce Nextcloud app-password instead of login password
* ♻️ segment into smaller widgets, improve mixin * ♻️ change NextcloudInfo to NextcloudUser * a small widget showing branding and uesr info, including quota * ✨ add NextcloudNotifications widget * show and delete Nextcloud notifications * ✨ add NextcloudUserStatus widget * display user statuses of selected users * ✨ add NextcloudStats widget (admin only) * display Nextcloud usage statistics (users, files, shares) * ✨ add NextcloudSystem widget (admin only) * visualise cpu load and memory utilisation, show server versions * ✨ add NextcloudPhpOpcache widget (admin only) * show statistics about php opcache performance * ✨ add a misc helper for formatting nunbers * 🌐 add translations to widget templates * 🌐 add translation entries for en * 🍱 add scss styles file, shared by all widgets
When a user status doesn't include a status message, it still may have a status emoji and it always has a status indicator (e.g. online). When {showEmpty=true} then statuses without a message are shown, otherwise hidden. Defaults to {false}.
Limit displayed notifications either by count or by age. An integer value is interpeted as count limit, a number suffixed with 'm', 'h' or 'd' is converted to minutes, hours or days, respectively, and older notifications are not shown.
✅ Deploy Preview for dashy-dev ready!
To edit notification comments on pull requests, go to your Netlify site settings. |
Changes preview: |
Hey, I thought these widgets could be useful. I'm going to check Sonar and DeepScan reports and see if I can improve a bit, and also add some docs. Open to any suggestions or change requests in the meantime. Cheers :) |
This looks AWESOME! I'll check through it properly later this evening / tomorrow morning. |
max-width: 44%; | ||
small { | ||
font-size: 12px; | ||
color: #999999; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Maybe
color: var(--widget-text-color);
opacity: var(--dimming-factor);`
Not sure if this will match, but at least it can be modified by the current theme, or on the users side if need be.
On a side note, very minor but if possible rem
is preferred over px
. Originally this was to respect the users browser preferences / for accessibility, but now it's mostly just for consistency. So this would be font-side: 0.75rem
.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
All looks great! Some really awesome, and neatly built widgets :) 🙌
Once the docs are added (probably under Self-Hosted Services Widgets), then I'll approve changes.
The only feedback I have is just aesthetic, nothing major at all
- Try and keep CSS units consistent, mixing px, % em, gets confusing. For text
rem
is preferred - Where possible, try to use CSS variables especially for colors. It makes makes it easier for the user to override, and also makes theming easier.
- If a data attribute is used just to apply styles, (like
data-nc-updates
), then classes are usually preferred instead
- use consistent css units - replace hard-coded color values with variables - update disk quota chart render (to allow for variable colors) - small style update to the notifications widget
The only place I left Building these widgets was a really pleasant job even as a first time Vue user, Dashy is cool! :) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Really awesome work 👏
Category:
Overview
Screenshot
Code Quality Checklist (Please complete)