DEV: fix tests, remove deprecation, fix for slider (#16)

This commit is contained in:
Kris 2023-07-13 18:47:03 -04:00 committed by GitHub
parent df87e144ef
commit 312faa8556
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 74 additions and 29 deletions

View File

@ -67,28 +67,50 @@
}
.user-card-directory-footer {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(5em, 1fr));
padding: 0.75em;
background-color: var(--secondary);
padding: 0px 10px 10px 10px;
display: flex;
flex-wrap: wrap;
gap: 0.25em;
border-top: 1px solid var(--primary-low);
.directory-table__column-header,
.directory-table__cell,
.directory-table__cell--empty,
.directory-table__cell--user-field {
border: none;
}
.stat {
flex-basis: 0;
flex-grow: 1;
display: flex;
flex-direction: column;
align-items: center;
margin: 2px;
gap: 0.1em;
border: none;
.label {
font-size: $font-down-2;
font-size: var(--font-down-2);
.d-icon {
margin-right: 0.2em;
color: var(--primary-medium);
}
}
&.stat-type-user_field {
// long user fields can break the layout
// so we truncate these to one line
.value {
display: flex;
overflow: hidden;
justify-content: center;
width: 100%;
min-width: 0;
span {
min-width: 0;
@include ellipsis;
}
}
}
}
}
}

View File

@ -1,4 +1,5 @@
import UserCardContents from "discourse/components/user-card-contents";
import { action } from "@ember/object";
export default UserCardContents.extend({
layoutName: "components/user-card-contents",
@ -8,4 +9,10 @@ export default UserCardContents.extend({
didInsertElement() {},
willDestroyElement() {},
keyUp() {},
// need to override this to work with the loading slider
@action
handleShowUser() {
return;
},
});

View File

@ -5,11 +5,11 @@
}}
<div class="container">
<div class="users-directory directory">
{{plugin-outlet
name="users-top"
connectorTagName="div"
args=(hash model=model)
}}
<PluginOutlet
@name="users-top"
@connectorTagName="div"
@outletArgs={{hash model=this.model}}
/>
<div class="directory-controls">
<div class="period-controls">
{{period-chooser
@ -30,12 +30,15 @@
{{i18n "directory.total_rows" count=model.totalRows}}
{{/if}}
</label>
{{input
value=(readonly nameInput)
input=(action "onUsernameFilterChanged" value="target.value")
placeholderKey="directory.filter_name"
<Input
@value={{readonly emailInput}}
placeholder={{I18n "directory.filter_name"}}
class="filter-name no-blur"
{{on
"input"
(action "onUsernameFilterChanged" value="target.value")
}}
/>
{{#if showGroupFilter}}
{{combo-box
class="directory-group-selector"
@ -52,12 +55,10 @@
class="btn-default open-edit-columns-btn"
}}
{{/if}}
{{plugin-outlet
name="users-directory-controls"
connectorTagName=""
tagName=""
args=(hash model=model)
}}
<PluginOutlet
@name="users-directory-controls"
@outletArgs={{hash model=this.model}}
/>
</div>
</div>
@ -76,7 +77,10 @@
{{#if (theme-setting "show_stats")}}
<div class="user-card-directory-footer">
{{#each columns as |column|}}
<span class="stat stat-{{stat.name}}">
<span
class="stat stat-{{dasherize column.name}}
stat-type-{{column.type}}"
>
<span class="value">
{{#if
(directory-column-is-user-field column=column)

View File

@ -133,7 +133,11 @@ acceptance("User Card Directory", function (needs) {
test("Displays table when cards=no", async function (assert) {
await visit("/u?cards=no");
assert.ok($("body.users-page").length, "has the body class");
assert.equal(count(".directory table tr"), 2, "has a list of users");
assert.equal(
count(".directory .directory-table__row"),
2,
"has a list of users"
);
});
test("Displays cards when cards=yes", async function (assert) {
@ -143,10 +147,18 @@ acceptance("User Card Directory", function (needs) {
test("Can toggle between views", async function (assert) {
await visit("/u?cards=no");
assert.equal(count(".directory table tr"), 2, "has two table rows");
assert.equal(
count(".directory .directory-table__row"),
2,
"has two table rows"
);
await click(".toggle-cards-button");
assert.equal(count(".user-card-avatar"), 2, "has two cards");
await click(".toggle-cards-button");
assert.equal(count(".directory table tr"), 2, "has two table rows");
assert.equal(
count(".directory .directory-table__row"),
2,
"has two table rows"
);
});
});