diff --git a/addon/components/file-icon.js b/addon/components/file-icon.js index 1195f47..2c2efd6 100644 --- a/addon/components/file-icon.js +++ b/addon/components/file-icon.js @@ -1,6 +1,8 @@ import Component from '@glimmer/component'; import { tracked } from '@glimmer/tracking'; import getWithDefault from '@fleetbase/ember-core/utils/get-with-default'; +import isModel from '@fleetbase/ember-core/utils/is-model'; +import isUploadFile from '../utils/is-upload-file'; export default class FileIconComponent extends Component { @tracked file; @@ -16,18 +18,29 @@ export default class FileIconComponent extends Component { } getExtension(file) { - if (!file || (!file.original_filename && !file.url && !file.path)) { + let filename; + + if (isModel(file)) { + filename = file.original_filename ?? file.url ?? file.path; + } + + if (isUploadFile(file)) { + filename = file.file ? file.file.name : null; + } + + if (typeof filename !== 'string') { return null; } - // Prefer to use the original filename if available, then URL, then path - const filename = file.original_filename || file.url || file.path; const extensionMatch = filename.match(/\.(.+)$/); return extensionMatch ? extensionMatch[1] : null; } getIcon(file) { const extension = this.getExtension(file); + if (!extension) { + return 'file-alt'; + } return getWithDefault( { diff --git a/addon/services/modals-manager.js b/addon/services/modals-manager.js index 040cbeb..75b2997 100644 --- a/addon/services/modals-manager.js +++ b/addon/services/modals-manager.js @@ -288,14 +288,20 @@ export default class ModalsManagerService extends Service { * Retrieves an option * * @param {String} key + * @param {Mixed} defaultValue * @return {Mixed} */ - @action getOption(key) { + @action getOption(key, defaultValue = null) { if (isArray(key)) { return this.getOptions(key); } - return get(this.options, key); + const value = get(this.options, key); + if (value === undefined) { + return defaultValue; + } + + return value; } /** diff --git a/addon/styles/layout/legacy.css b/addon/styles/layout/legacy.css index 5cd2831..c436bd5 100644 --- a/addon/styles/layout/legacy.css +++ b/addon/styles/layout/legacy.css @@ -369,7 +369,7 @@ body[data-theme='dark'] .overlay-panel-section-title { #console-loader, .overloader { - @apply absolute inset-0 w-full h-full bg-gray-100 text-gray-800 flex items-center justify-center bg-opacity-10; + @apply absolute inset-0 w-full h-full text-gray-800 flex items-center justify-center bg-opacity-10; z-index: 9999999999; } diff --git a/addon/styles/layout/next.css b/addon/styles/layout/next.css index 341dcee..cfccb7a 100644 --- a/addon/styles/layout/next.css +++ b/addon/styles/layout/next.css @@ -1239,6 +1239,10 @@ body[data-theme='dark'] .next-sidebar .next-sidebar-panel-container > .next-side background-color: #ffffff; } +body[data-theme="dark"] .next-sidebar .next-sidebar-panel-container > .next-sidebar-panel > .next-content-panel > .next-content-panel-body .next-nav-item.next-nav-item-with-dropdown:hover .ember-basic-dropdown-trigger > span.btn-wrapper > button.btn:hover { + background-color: #374151; +} + .next-sidebar .next-sidebar-panel-container > .next-sidebar-panel > .next-content-panel > .next-content-panel-body .next-nav-item.next-nav-item-with-dropdown:hover .ember-basic-dropdown-trigger > span.btn-wrapper > button.btn { color: #000000; } @@ -1890,6 +1894,19 @@ a.text-danger:hover { animation: rotation 1s linear infinite; } +.overloader > .loader-container { + background: rgba(243, 244, 246, .25); + border: 1px solid #d1d5db; + backdrop-filter: blur(3.5px); + border-radius: .5rem; + padding: .25rem .85rem; +} + +body[data-theme="dark"] .overloader > .loader-container { + background: rgb(31, 41, 55, .25); + border: 1px solid rgba(15, 23, 42, .25); +} + @keyframes rotation { 0% { transform: rotate(0deg); diff --git a/addon/utils/is-upload-file.js b/addon/utils/is-upload-file.js new file mode 100644 index 0000000..e462c41 --- /dev/null +++ b/addon/utils/is-upload-file.js @@ -0,0 +1,5 @@ +import { UploadFile } from 'ember-file-upload'; + +export default function isUploadFile(file) { + return file instanceof UploadFile; +} diff --git a/app/utils/is-upload-file.js b/app/utils/is-upload-file.js new file mode 100644 index 0000000..89f9f7f --- /dev/null +++ b/app/utils/is-upload-file.js @@ -0,0 +1 @@ +export { default } from '@fleetbase/ember-ui/utils/is-upload-file'; diff --git a/package.json b/package.json index c44b138..59c2b63 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@fleetbase/ember-ui", - "version": "0.2.14", + "version": "0.2.15", "description": "Fleetbase UI provides all the interface components, helpers, services and utilities for building a Fleetbase extension into the Console.", "keywords": [ "fleetbase-ui", diff --git a/tests/unit/utils/is-upload-file-test.js b/tests/unit/utils/is-upload-file-test.js new file mode 100644 index 0000000..6a49831 --- /dev/null +++ b/tests/unit/utils/is-upload-file-test.js @@ -0,0 +1,9 @@ +// import isUploadFile from 'dummy/utils/is-upload-file'; +import { module, test } from 'qunit'; + +module('Unit | Utility | is-upload-file', function () { + test('it works', function (assert) { + // let result = isUploadFile(); + assert.ok(true); + }); +});