Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 3 additions & 2 deletions packages/app-aco/src/components/Search/Search.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,13 +5,14 @@ import { SearchWrapper } from "./styled";

interface SearchProps {
value: string;
placeholder: string;
onChange: (value: string) => void;
}

export const Search = ({ value, onChange }: SearchProps) => {
export const Search = ({ value, placeholder, onChange }: SearchProps) => {
return (
<SearchWrapper>
<SearchUI value={value} onChange={onChange} />
<SearchUI value={value} inputPlaceholder={placeholder} onChange={onChange} />
</SearchWrapper>
);
};
8 changes: 7 additions & 1 deletion packages/app-aco/src/contexts/acoList.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import React, { useCallback, useContext, useEffect } from "react";
import React, { useCallback, useContext, useEffect, useMemo } from "react";
import dotPropImmutable from "dot-prop-immutable";
import pick from "lodash/pick";
import { useStateIfMounted } from "@webiny/app-admin";
Expand All @@ -23,6 +23,7 @@ import { sortTableItems, validateOrGetDefaultDbSort } from "~/sorting";
import { ROOT_FOLDER } from "~/constants";

export interface AcoListContextData<T> {
currentFolder?: FolderItem;
folders: FolderItem[];
hideFilters: () => void;
isListLoading: boolean;
Expand Down Expand Up @@ -389,6 +390,10 @@ export const AcoListProvider = ({ children, ...props }: AcoListProviderProps) =>
state.folderId
]);

const currentFolder = useMemo(() => {
return originalFolders?.find(folder => folder.id === currentFolderId);
}, [originalFolders, currentFolderId]);

const context: AcoListContextData<GenericSearchData> = {
...pick(state, [
"isSearch",
Expand All @@ -399,6 +404,7 @@ export const AcoListProvider = ({ children, ...props }: AcoListProviderProps) =>
"isSelectedAll"
]),
folders,
currentFolder,
records,
listTitle,
isListLoading: Boolean(
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ interface HeaderProps {
onCreateEntry: (event?: React.SyntheticEvent) => void;
onCreateFolder: (event?: React.SyntheticEvent) => void;
searchValue: string;
searchPlaceholder: string;
onSearchChange: (value: string) => void;
}

Expand All @@ -23,6 +24,7 @@ export const Header = (props: HeaderProps) => {
onCreateFolder,
title,
searchValue,
searchPlaceholder,
onSearchChange
} = props;

Expand All @@ -33,7 +35,11 @@ export const Header = (props: HeaderProps) => {
</TitleColumn>
<ActionsColumn>
<WrapperActions>
<Search value={searchValue} onChange={onSearchChange} />
<Search
value={searchValue}
placeholder={searchPlaceholder}
onChange={onSearchChange}
/>
<ButtonFilters />
<ButtonsCreate
canCreateFolder={canCreateFolder}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -92,6 +92,7 @@ export const Main = ({ folderId: initialFolderId }: MainProps) => {
onCreateEntry={createEntry}
onCreateFolder={onCreateFolder}
searchValue={list.search}
searchPlaceholder={list.searchPlaceholder}
onSearchChange={list.setSearch}
/>
<BulkActions />
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -54,6 +54,7 @@ export interface ContentEntriesListProviderContext {
isSelectedAll: boolean;
getWhere: () => Record<string, any>;
searchQuery: string;
searchPlaceholder: string;
}

export const ContentEntriesListContext = React.createContext<
Expand All @@ -71,6 +72,7 @@ export const ContentEntriesListProvider = ({ children }: ContentEntriesListProvi

const {
folders: initialFolders,
currentFolder,
isListLoading,
isListLoadingMore,
isSearch,
Expand Down Expand Up @@ -185,6 +187,18 @@ export const ContentEntriesListProvider = ({ children }: ContentEntriesListProvi
[currentFolderId, baseUrl]
);

const searchPlaceholder = useMemo(() => {
if (!currentFolder) {
return "Search...";
}

if (currentFolder.id === ROOT_FOLDER) {
return `Search all ${contentModel.pluralApiName}`;
}

return `Search in "${currentFolder.title}"`;
}, [currentFolder, contentModel]);

const context: ContentEntriesListProviderContext = {
modelId: contentModel.modelId,
folderId: currentFolderId || ROOT_FOLDER,
Expand All @@ -200,6 +214,7 @@ export const ContentEntriesListProvider = ({ children }: ContentEntriesListProvi
onSelectRow,
records,
search,
searchPlaceholder,
selected,
setSelected,
setSearch,
Expand Down