-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge branch 'develop' into meetings-table
- Loading branch information
Showing
21 changed files
with
229 additions
and
112 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,54 @@ | ||
import {FiDelete} from "solid-icons/fi"; | ||
import {Show, VoidComponent, createEffect, createSignal, on} from "solid-js"; | ||
import {cx, htmlAttributes} from "../utils"; | ||
import {Button} from "./Button"; | ||
import {TextInput} from "./TextInput"; | ||
import {splitProps} from "solid-js"; | ||
|
||
interface Props extends htmlAttributes.input { | ||
readonly divClass?: string; | ||
} | ||
|
||
export const SearchInput: VoidComponent<Props> = (allProps) => { | ||
const [props, inputProps] = splitProps(allProps, ["divClass"]); | ||
let ref: HTMLInputElement | undefined; | ||
const [value, setValue] = createSignal(""); | ||
function setNow() { | ||
setValue(ref?.value || ""); | ||
} | ||
createEffect( | ||
on( | ||
() => inputProps.value, | ||
() => setTimeout(setNow, 0), | ||
), | ||
); | ||
return ( | ||
<div class={cx(props.divClass, "flex items-stretch relative")}> | ||
<TextInput | ||
{...htmlAttributes.merge(inputProps, { | ||
class: "grow !pr-6", | ||
onInput: setNow, | ||
onChange: setNow, | ||
})} | ||
ref={(input) => { | ||
ref = input; | ||
(inputProps.ref as (elem: HTMLInputElement) => void)?.(input); | ||
}} | ||
/> | ||
<Show when={value()}> | ||
<Button | ||
class="absolute right-0 top-0 bottom-0 px-2" | ||
onClick={() => { | ||
if (ref) { | ||
ref.value = ""; | ||
ref.dispatchEvent(new InputEvent("input")); | ||
ref.focus(); | ||
} | ||
}} | ||
> | ||
<FiDelete /> | ||
</Button> | ||
</Show> | ||
</div> | ||
); | ||
}; |
24 changes: 12 additions & 12 deletions
24
...ces/js/components/ui/Table/FilterIcon.tsx → .../components/ui/Table/FilterIconButton.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
28 changes: 28 additions & 0 deletions
28
resources/js/components/ui/Table/TableFiltersClearButton.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,28 @@ | ||
import {useLangFunc} from "components/utils"; | ||
import {VoidComponent} from "solid-js"; | ||
import {FilterIconButton} from "./FilterIconButton"; | ||
import {useTable} from "./TableContext"; | ||
|
||
interface Props { | ||
readonly columnsWithActiveFilters: readonly string[]; | ||
readonly clearColumnFilters: () => void; | ||
} | ||
|
||
export const TableFiltersClearButton: VoidComponent<Props> = (props) => { | ||
const t = useLangFunc(); | ||
const table = useTable(); | ||
return ( | ||
<FilterIconButton | ||
class="border border-input-border rounded px-1" | ||
isFiltering={props.columnsWithActiveFilters.length > 0} | ||
onClear={props.clearColumnFilters} | ||
title={ | ||
props.columnsWithActiveFilters.length | ||
? `${t("tables.filter.column_filters_set")}\n${props.columnsWithActiveFilters | ||
.map((column) => `- ${table.options.meta?.translations?.columnNames(column)}`) | ||
.join("\n")}\n${t("tables.filter.click_to_clear")}` | ||
: t("tables.filter.column_filters_cleared") | ||
} | ||
/> | ||
); | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,27 +1,25 @@ | ||
import {htmlAttributes, useLangFunc} from "components/utils"; | ||
import {ParentProps, VoidComponent, createComputed, createSignal, splitProps} from "solid-js"; | ||
import {cx, useLangFunc} from "components/utils"; | ||
import {ParentProps, VoidComponent} from "solid-js"; | ||
import {useTable} from "."; | ||
import {SearchInput} from "../SearchInput"; | ||
|
||
interface Props extends htmlAttributes.div { | ||
interface Props { | ||
readonly divClass?: string; | ||
readonly placeholder?: string; | ||
} | ||
|
||
export const TableSearch: VoidComponent<ParentProps<Props>> = (allProps) => { | ||
const [props, divProps] = splitProps(allProps, ["placeholder"]); | ||
export const TableSearch: VoidComponent<ParentProps<Props>> = (props) => { | ||
const t = useLangFunc(); | ||
const table = useTable(); | ||
const [query, setQuery] = createSignal(table.getState().globalFilter); | ||
createComputed(() => table.setGlobalFilter(query())); | ||
const globalFilter = (): string => table.getState().globalFilter; | ||
return ( | ||
<div {...divProps}> | ||
<input | ||
class="w-full h-full px-2 border border-input-border rounded" | ||
name="table_global_search" | ||
type="search" | ||
placeholder={props.placeholder || t("actions.search")} | ||
value={query()} | ||
onInput={({target: {value}}) => setQuery(value)} | ||
/> | ||
</div> | ||
<SearchInput | ||
divClass={cx("flex items-stretch", props.divClass)} | ||
name="table_global_search" | ||
class="px-1" | ||
placeholder={props.placeholder || t("actions.search")} | ||
value={globalFilter()} | ||
onInput={({target: {value}}) => table.setGlobalFilter(value)} | ||
/> | ||
); | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -41,8 +41,4 @@ | |
} | ||
} | ||
} | ||
|
||
.filterIcon { | ||
@apply mb-1; | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,11 @@ | ||
import {VoidComponent} from "solid-js"; | ||
import {htmlAttributes} from "../utils"; | ||
|
||
export const TextInput: VoidComponent<htmlAttributes.input> = (inputProps) => ( | ||
<input | ||
type="text" | ||
{...htmlAttributes.merge(inputProps, { | ||
class: "border border-input-border rounded aria-invalid:border-red-400 disabled:bg-disabled", | ||
})} | ||
/> | ||
); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -3,51 +3,51 @@ import {MemberResource} from "./member.resource"; | |
/** | ||
* @see `/app/Http/Resources/Admin/AdminUserResource.php` | ||
*/ | ||
export type AdminUserResource = { | ||
export interface AdminUserResource { | ||
/** | ||
* admin user identifier | ||
* @type {string(uuid)} | ||
* @example '67da972b-34d7-4f89-b8ae-322d96b4954d' | ||
*/ | ||
id: string; | ||
readonly id: string; | ||
/** | ||
* admin user full name | ||
* @type {string} | ||
*/ | ||
name: string; | ||
readonly name: string; | ||
/** | ||
* email address | ||
* @type {string} | ||
* @example '[email protected]' | ||
*/ | ||
email: string | null; | ||
readonly email: string | null; | ||
/** | ||
* facility identifier where the user was last logged in | ||
* @type {string(uuid)} | ||
* @example '67da972b-34d7-4f89-b8ae-322d96b4954d' | ||
*/ | ||
lastLoginFacilityId: string | null; | ||
passwordExpireAt: string | null; | ||
hasPassword: boolean; | ||
createdAt: string; | ||
updatedAt: string; | ||
hasEmailVerified: boolean; | ||
readonly lastLoginFacilityId: string | null; | ||
readonly passwordExpireAt: string | null; | ||
readonly hasPassword: boolean; | ||
readonly createdAt: string; | ||
readonly updatedAt: string; | ||
readonly hasEmailVerified: boolean; | ||
/** | ||
* identifier of a user who created this user | ||
* @type {string(uuid)} | ||
* @example '67da972b-34d7-4f89-b8ae-322d96b4954d' | ||
*/ | ||
createdBy: string; | ||
hasGlobalAdmin: boolean; | ||
readonly createdBy: string; | ||
readonly hasGlobalAdmin: boolean; | ||
/** | ||
* array of members | ||
* @type {MemberResource[]} | ||
*/ | ||
members: MemberResource[]; | ||
}; | ||
readonly members: readonly MemberResource[]; | ||
} | ||
|
||
/** The user resource used for creation. */ | ||
export type AdminUserResourceForCreate = Pick< | ||
AdminUserResource, | ||
"name" | "email" | "hasEmailVerified" | "passwordExpireAt" | "hasGlobalAdmin" | ||
> & {password: string | null}; | ||
> & {readonly password: string | null}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.