Skip to content

Commit

Permalink
Merge branch 'arc53:main' into main
Browse files Browse the repository at this point in the history
  • Loading branch information
@ManishMadan2882
ManishMadan2882 authored Nov 26, 2024
2 parents a8231d3 + 0584c29 commit 4ab1266
Show file tree
Hide file tree
Showing 8 changed files with 315 additions and 210 deletions.
13 changes: 12 additions & 1 deletion application/api/user/routes.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -479,11 +479,22 @@ def get(self):
sort_order = request.args.get("order", "desc") # Default to 'desc'
page = int(request.args.get("page", 1)) # Default to 1
rows_per_page = int(request.args.get("rows", 10)) # Default to 10
# add .strip() to remove leading and trailing whitespaces
search_term = request.args.get(
"search", ""
).strip() # add search for filter documents

# Prepare
# Prepare query for filtering
query = {"user": user}
if search_term:
query["name"] = {
"$regex": search_term,
"$options": "i", # using case-insensitive search
}

total_documents = sources_collection.count_documents(query)
total_pages = max(1, math.ceil(total_documents / rows_per_page))
page = min(max(1, page), total_pages) # add this to make sure page inbound is within the range
sort_order = 1 if sort_order == "asc" else -1
skip = (page - 1) * rows_per_page

Expand Down
10 changes: 9 additions & 1 deletion application/celery_init.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,14 +2,22 @@
from application.core.settings import settings
from celery.signals import setup_logging


def make_celery(app_name=__name__):
celery = Celery(app_name, broker=settings.CELERY_BROKER_URL, backend=settings.CELERY_RESULT_BACKEND)
celery = Celery(
app_name,
broker=settings.CELERY_BROKER_URL,
backend=settings.CELERY_RESULT_BACKEND,
)
celery.conf.update(settings)
return celery


@setup_logging.connect
def config_loggers(*args, **kwargs):
from application.core.logging_config import setup_logging

setup_logging()


celery = make_celery()
67 changes: 45 additions & 22 deletions frontend/src/components/DocumentPagination.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,10 @@ const Pagination: React.FC<PaginationProps> = ({
onPageChange,
onRowsPerPageChange,
}) => {
const [rowsPerPageOptions] = useState([5, 10, 15, 20]);
const [isDropdownOpen, setIsDropdownOpen] = useState(false);
const rowsPerPageOptions = [5, 10, 20, 50];

const toggleDropdown = () => setIsDropdownOpen((prev) => !prev);

const handlePreviousPage = () => {
if (currentPage > 1) {
Expand All @@ -41,31 +44,51 @@ const Pagination: React.FC<PaginationProps> = ({
onPageChange(totalPages);
};

const handleSelectRowsPerPage = (rows: number) => {
setIsDropdownOpen(false);
onRowsPerPageChange(rows);
};

return (
<div className="flex items-center text-xs justify-end gap-4 mt-2 p-2 border-gray-200">
<div className="flex items-center gap-2 ">
{/* Rows per page dropdown */}
<div className="flex items-center gap-2 relative">
<span className="text-gray-900 dark:text-gray-50">Rows per page:</span>
<select
value={rowsPerPage}
onChange={(e) => onRowsPerPageChange(Number(e.target.value))}
className="border border-gray-300 rounded px-2 py-1 dark:bg-dark-charcoal dark:text-gray-50"
>
{rowsPerPageOptions.map((option) => (
<option
className="bg-white dark:bg-dark-charcoal dark:text-gray-50"
key={option}
value={option}
>
{option}
</option>
))}
</select>
<div className="relative">
<button
onClick={toggleDropdown}
className="px-3 py-1 border rounded dark:bg-dark-charcoal dark:text-light-gray hover:bg-gray-200 dark:hover:bg-neutral-700"
>
{rowsPerPage}
</button>
<div
className={`absolute z-50 right-0 mt-1 w-28 transform bg-white dark:bg-dark-charcoal shadow-lg ring-1 ring-black ring-opacity-5 transition-all duration-200 ease-in-out ${
isDropdownOpen
? 'scale-100 opacity-100 block'
: 'scale-95 opacity-0 hidden'
}`}
>
{rowsPerPageOptions.map((option) => (
<div
key={option}
onClick={() => handleSelectRowsPerPage(option)}
className={`cursor-pointer px-4 py-2 text-xs hover:bg-gray-100 dark:hover:bg-neutral-700 ${
rowsPerPage === option
? 'bg-gray-100 dark:bg-neutral-700 dark:text-light-gray'
: 'bg-white dark:bg-dark-charcoal dark:text-light-gray'
}`}
>
{option}
</div>
))}
</div>
</div>
</div>

{/* Pagination controls */}
<div className="text-gray-900 dark:text-gray-50">
Page {currentPage} of {totalPages}
</div>

<div className="flex items-center gap-2 text-gray-900 dark:text-gray-50">
<button
onClick={handleFirstPage}
Expand All @@ -74,7 +97,7 @@ const Pagination: React.FC<PaginationProps> = ({
>
<img
src={DoubleArrowLeft}
alt="arrow"
alt="First page"
className="dark:invert dark:sepia dark:brightness-200"
/>
</button>
Expand All @@ -85,7 +108,7 @@ const Pagination: React.FC<PaginationProps> = ({
>
<img
src={SingleArrowLeft}
alt="arrow"
alt="Previous page"
className="dark:invert dark:sepia dark:brightness-200"
/>
</button>
Expand All @@ -96,7 +119,7 @@ const Pagination: React.FC<PaginationProps> = ({
>
<img
src={SingleArrowRight}
alt="arrow"
alt="Next page"
className="dark:invert dark:sepia dark:brightness-200"
/>
</button>
Expand All @@ -107,7 +130,7 @@ const Pagination: React.FC<PaginationProps> = ({
>
<img
src={DoubleArrowRight}
alt="arrow"
alt="Last page"
className="dark:invert dark:sepia dark:brightness-200"
/>
</button>
Expand Down
2 changes: 1 addition & 1 deletion frontend/src/components/DropdownMenu.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@ export default function DropdownMenu({
<div className="static inline-block text-left" ref={dropdownRef}>
<button
onClick={handleToggle}
className="flex w-20 cursor-pointer flex-row items-center gap-px rounded-3xl border-purple-30/25 bg-purple-30 p-2 text-xs text-white hover:bg-[#6F3FD1] focus:outline-none"
className="flex w-20 cursor-pointer flex-row gap-1 rounded-3xl border-purple-30/25 bg-purple-30 p-2 text-xs text-white hover:bg-[#6F3FD1] focus:outline-none"
>
{icon && <img src={icon} alt="OptionIcon" className="h-4 w-4" />}
{selectedOption.value !== 'never' ? selectedOption.label : name}
Expand Down
12 changes: 8 additions & 4 deletions frontend/src/index.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -50,19 +50,23 @@ body.dark {

@layer components {
.table-default {
@apply block w-full mx-auto table-auto content-start justify-center rounded-xl border border-silver dark:border-silver/40 text-center dark:text-bright-gray overflow-auto;
@apply block w-full table-auto content-start justify-center rounded-xl border border-silver dark:border-silver/40 text-center dark:text-bright-gray overflow-auto;
}

.table-default th {
@apply p-4 w-full font-normal text-gray-400 text-nowrap; /* Remove border-r */
@apply p-4 font-normal text-gray-400 text-nowrap; /* Remove border-r */
}

.table-default th {
flex: 1;
}

.table-default th:last-child {
@apply w-[auto];
flex: 0; /* Ensure the last column does not stretch unnecessarily */
}

.table-default td {
@apply border-t border-silver dark:border-silver/40 px-4 py-2; /* Remove border-r */
@apply border-t w-full border-silver dark:border-silver/40 px-4 py-2; /* Remove border-r */
}

.table-default td:last-child {
Expand Down
3 changes: 2 additions & 1 deletion frontend/src/preferences/preferenceApi.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,9 +25,10 @@ export async function getDocsWithPagination(
order = 'desc',
pageNumber = 1,
rowsPerPage = 10,
searchTerm = '',
): Promise<GetDocsResponse | null> {
try {
const query = `sort=${sort}&order=${order}&page=${pageNumber}&rows=${rowsPerPage}`;
const query = `sort=${sort}&order=${order}&page=${pageNumber}&rows=${rowsPerPage}&search=${searchTerm}`;
const response = await userService.getDocsWithPagination(query);
const data = await response.json();
const docs: Doc[] = [];
Expand Down
85 changes: 50 additions & 35 deletions frontend/src/settings/APIKeys.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -109,41 +109,56 @@ export default function APIKeys() {
{loading ? (
<SkeletonLoader count={1} component={'chatbot'} />
) : (
<table className="table-default">
<thead>
<tr>
<th>{t('settings.apiKeys.name')}</th>
<th>{t('settings.apiKeys.sourceDoc')}</th>
<th>{t('settings.apiKeys.key')}</th>
<th></th>
</tr>
</thead>
<tbody>
{!apiKeys?.length && (
<tr>
<td colSpan={4} className="!p-4">
{t('settings.apiKeys.noData')}
</td>
</tr>
)}
{apiKeys?.map((element, index) => (
<tr key={index}>
<td>{element.name}</td>
<td>{element.source}</td>
<td>{element.key}</td>
<td>
<img
src={Trash}
alt="Delete"
className="h-4 w-4 cursor-pointer hover:opacity-50"
id={`img-${index}`}
onClick={() => handleDeleteKey(element.id)}
/>
</td>
</tr>
))}
</tbody>
</table>
<div className="flex flex-col">
<div className="flex-grow">
<div className="dark:border-silver/40 border-silver rounded-md border overflow-auto">
<table className="min-w-full divide-y divide-silver dark:divide-silver/40 ">
<thead>
<tr className="text-start text-sm font-medium text-gray-700 dark:text-gray-50 uppercase">
<th className="p-2">{t('settings.apiKeys.name')}</th>
<th className="p-2">
{t('settings.apiKeys.sourceDoc')}
</th>
<th className="p-2">{t('settings.apiKeys.key')}</th>
<th></th>
</tr>
</thead>
<tbody className="divide-y divide-gray-200 dark:divide-neutral-700">
{!apiKeys?.length && (
<tr>
<td
colSpan={4}
className="!p-4 text-gray-800 dark:text-neutral-200 text-center"
>
{t('settings.apiKeys.noData')}
</td>
</tr>
)}
{Array.isArray(apiKeys) &&
apiKeys?.map((element, index) => (
<tr
key={index}
className="text-nowrap whitespace-nowrap text-center text-sm font-medium text-gray-800 dark:text-neutral-200 p-2"
>
<td className="p-1">{element.name}</td>
<td className="p-2">{element.source}</td>
<td>{element.key}</td>
<td>
<img
src={Trash}
alt="Delete"
className="h-4 w-4 cursor-pointer hover:opacity-50"
id={`img-${index}`}
onClick={() => handleDeleteKey(element.id)}
/>
</td>
</tr>
))}
</tbody>
</table>
</div>
</div>
</div>
)}
</div>
</div>
Expand Down
Loading

0 comments on commit 4ab1266

Please sign in to comment.