Skip to content

Commit

Permalink
switching urls, styling tweaks, outgoing/incoming
Browse files Browse the repository at this point in the history
  • Loading branch information
Jacobjeevan committed Jan 31, 2025
1 parent a964e29 commit d3580a9
Show file tree
Hide file tree
Showing 8 changed files with 135 additions and 48 deletions.
2 changes: 2 additions & 0 deletions public/locale/en.json
Original file line number Diff line number Diff line change
Expand Up @@ -1072,6 +1072,7 @@
"immunisation-records": "Immunisation",
"in_consultation": "In-Consultation",
"inactive": "Inactive",
"incoming": "Incoming",
"incomplete_patient_details_warning": "Patient details are incomplete. Please update the details before proceeding.",
"inconsistent_dosage_units_error": "Dosage units must be same",
"indian_mobile": "Indian Mobile",
Expand Down Expand Up @@ -1439,6 +1440,7 @@
"otp_verification_error": "Failed to verify OTP. Please try again later.",
"otp_verification_success": "OTP has been verified successfully.",
"out_of_range_error": "Value must be between {{ start }} and {{ end }}.",
"outgoing": "Outgoing",
"overview": "Overview",
"oxygen_information": "Oxygen Information",
"packages": "Packages",
Expand Down
12 changes: 9 additions & 3 deletions src/Routers/routes/ResourceRoutes.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,9 +5,15 @@ import ResourceList from "@/components/Resource/ResourceList";
import { AppRoutes } from "@/Routers/AppRouter";

const ResourceRoutes: AppRoutes = {
"/resource": () => <ResourceList />,
"/resource/:id": ({ id }) => <ResourceDetails id={id} />,
"/resource/:id/update": ({ id }) => <ResourceDetailsUpdate id={id} />,
"/facility/:facilityId/resource": ({ facilityId }) => (
<ResourceList facilityId={facilityId} />
),
"/facility/:facilityId/resource/:id": ({ facilityId, id }) => (
<ResourceDetails facilityId={facilityId} id={id} />
),
"/facility/:facilityId/resource/:id/update": ({ facilityId, id }) => (
<ResourceDetailsUpdate facilityId={facilityId} id={id} />
),
};

export default ResourceRoutes;
Original file line number Diff line number Diff line change
Expand Up @@ -112,7 +112,11 @@ export const ResourceRequests = (props: PatientProps) => {
<Button
variant="outline"
size="sm"
onClick={() => navigate(`/resource/${request.id}`)}
onClick={() =>
navigate(
`/facility/${request.origin_facility.id}/resource/${request.id}`,
)
}
>
<CareIcon icon="l-eye" className="mr-2" />
{t("view")}
Expand Down
2 changes: 1 addition & 1 deletion src/components/Resource/ResourceCreate.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -130,7 +130,7 @@ export default function ResourceCreate(props: ResourceProps) {

if (res?.ok && responseData) {
toast.success(t("resource_created_successfully"));
navigate(`/resource/${responseData.id}`);
navigate(`/facility/${facilityId}/resource/${responseData.id}`);
}
} catch (error) {
console.error(error);
Expand Down
24 changes: 17 additions & 7 deletions src/components/Resource/ResourceDetails.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -203,11 +203,17 @@ const RequestLetter = (data: ResourceRequest) => {
);
};

export default function ResourceDetails(props: { id: string }) {
export default function ResourceDetails({
id,
facilityId,
}: {
id: string;
facilityId: string;
}) {
const [isPrintMode, setIsPrintMode] = useState(false);
const { t } = useTranslation();
const { data, loading } = useTanStackQueryInstead(routes.getResourceDetails, {
pathParams: { id: props.id },
pathParams: { id: id },
onResponse: ({ res, data }) => {
if (!res && !data) {
navigate("/not-found");
Expand All @@ -222,8 +228,8 @@ export default function ResourceDetails(props: { id: string }) {
return (
<Page
title="Request Details"
crumbsReplacements={{ [props.id]: { name: data.title } }}
backUrl="/resource/board"
crumbsReplacements={{ [id]: { name: data.title } }}
backUrl={`/facility/${facilityId}/resource`}
>
<div className="mx-auto max-w-7xl space-y-6 p-4 md:p-6">
{/* Action Buttons */}
Expand All @@ -239,7 +245,9 @@ export default function ResourceDetails(props: { id: string }) {
<Button
variant="outline"
className="w-full sm:w-auto"
onClick={() => navigate(`/resource/${data.id}/update`)}
onClick={() =>
navigate(`/facility/${facilityId}/resource/${id}/update`)
}
>
<CareIcon icon="l-edit" className="mr-2 h-4 w-4" />
{t("update_status")}
Expand All @@ -261,7 +269,9 @@ export default function ResourceDetails(props: { id: string }) {
<div className="grid gap-4 md:grid-cols-2">
<div className="space-y-1">
<p className="text-sm font-medium">{t("status")}</p>
<Badge>{data.status}</Badge>
<Badge>
{t(`resource_status__${data.status.toLowerCase()}`)}
</Badge>
</div>
<div className="space-y-1">
<p className="text-sm font-medium">{t("category")}</p>
Expand Down Expand Up @@ -367,7 +377,7 @@ export default function ResourceDetails(props: { id: string }) {
<CardTitle className="text-lg">{t("comments")}</CardTitle>
</CardHeader>
<CardContent>
<CommentSection id={props.id} />
<CommentSection id={id} />
</CardContent>
</Card>
</div>
Expand Down
8 changes: 5 additions & 3 deletions src/components/Resource/ResourceDetailsUpdate.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,7 @@ import { UpdateResourceRequest } from "@/types/resourceRequest/resourceRequest";

interface resourceProps {
id: string;
facilityId: string;
}

const initForm: Partial<UpdateResourceRequest> = {
Expand Down Expand Up @@ -178,7 +179,7 @@ export const ResourceDetailsUpdate = (props: resourceProps) => {
if (res && res.status == 200 && data) {
dispatch({ type: "set_form", form: data });
toast.success(t("request_updated_successfully"));
navigate(`/resource/${props.id}`);
navigate(`/facility/${props.facilityId}/resource/${props.id}`);
} else {
setIsLoading(false);
}
Expand All @@ -192,7 +193,7 @@ export const ResourceDetailsUpdate = (props: resourceProps) => {
return (
<Page
title="Update Request"
backUrl={`/resource/${props.id}`}
backUrl={`/facility/${props.facilityId}/resource/${props.id}`}
crumbsReplacements={{ [props.id]: { name: resourceDetails?.title } }}
>
<div className="mt-4">
Expand All @@ -204,8 +205,9 @@ export const ResourceDetailsUpdate = (props: resourceProps) => {
name="status"
value={state.form.status}
options={RESOURCE_STATUS_CHOICES}
optionValue={(option) => option.text}
onChange={handleChange}
optionLabel={(option) => t(`resource_status__${option}`)}
optionLabel={(option) => t(`resource_status__${option.text}`)}
/>
</div>
<div className="md:col-span-1">
Expand Down
123 changes: 91 additions & 32 deletions src/components/Resource/ResourceList.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import {
Card,
CardContent,
CardDescription,
CardFooter,
CardHeader,
CardTitle,
} from "@/components/ui/card";
Expand Down Expand Up @@ -58,12 +59,12 @@ function EmptyState() {
);
}

export default function ResourceList() {
export default function ResourceList({ facilityId }: { facilityId: string }) {
const { qParams, updateQuery, Pagination, resultsPerPage } = useFilters({
limit: 15,
cacheBlacklist: ["title"],
});
const { status, title } = qParams;
const { status, title, outgoing } = qParams;

const searchOptions = [
{
Expand All @@ -85,13 +86,16 @@ export default function ResourceList() {
const { data: queryResources, isLoading } = useQuery<
PaginatedResponse<ResourceRequest>
>({
queryKey: ["resources", qParams],
queryKey: ["resources", facilityId, qParams],
queryFn: query.debounced(routes.listResourceRequests, {
queryParams: {
status: currentStatus,
title,
limit: resultsPerPage,
offset: ((qParams.page || 1) - 1) * resultsPerPage,
...(outgoing
? { origin_facility: facilityId }
: { assigned_facility: facilityId }),
},
}),
});
Expand Down Expand Up @@ -154,6 +158,39 @@ export default function ResourceList() {
</div>
</PopoverContent>
</Popover>
<div className="hidden md:flex items-center">
<Tabs
value={outgoing ? "outgoing" : "incoming"}
className="w-full"
>
<TabsList className="bg-transparent p-0 h-8">
<TabsTrigger
value="outgoing"
className="data-[state=active]:bg-primary/10 data-[state=active]:text-primary"
onClick={() =>
updateQuery({
outgoing: true,
title,
})
}
>
{t("outgoing")}
</TabsTrigger>
<TabsTrigger
value="incoming"
className="data-[state=active]:bg-primary/10 data-[state=active]:text-primary"
onClick={() =>
updateQuery({
outgoing: false,
title,
})
}
>
{t("incoming")}
</TabsTrigger>
</TabsList>
</Tabs>
</div>
</div>

<div className="hidden md:flex items-center">
Expand Down Expand Up @@ -240,7 +277,7 @@ export default function ResourceList() {
{resources.map((resource: ResourceRequest) => (
<Card
key={resource.id}
className="hover:shadow-lg transition-shadow group"
className="hover:shadow-lg transition-shadow group flex flex-col justify-between"
>
<CardHeader className="space-y-1 pb-2">
<div className="flex items-center justify-between">
Expand All @@ -252,41 +289,63 @@ export default function ResourceList() {
{resource.reason}
</CardDescription>
</CardHeader>
<CardContent>
<div className="flex flex-col space-y-2">
<div className="flex flex-wrap items-center gap-2">
{resource.emergency && (
<Badge
variant="outline"
className="bg-red-100 text-red-800"
>
{t("emergency")}
</Badge>
)}
<CardContent className="flex flex-col space-y-2 px-6 py-0">
<div className="flex flex-wrap items-center gap-2">
{resource.emergency && (
<Badge
variant="outline"
className="bg-gray-100 text-gray-800"
className="bg-red-100 text-red-800"
>
{
RESOURCE_CATEGORY_CHOICES.find(
(o) => o.id === resource.category,
)?.text
}
{t("emergency")}
</Badge>
</div>
<Separator className="my-2" />
<Link
href={`/resource/${resource.id}`}
className="text-sm text-primary hover:underline text-right flex items-center justify-end group-hover:translate-x-1 transition-transform"
)}
<Badge
variant="outline"
className="bg-gray-100 text-gray-800"
>
View Details
<CareIcon
icon="l-arrow-right"
className="ml-1 h-4 w-4"
/>
</Link>
{
RESOURCE_CATEGORY_CHOICES.find(
(o) => o.id === resource.category,
)?.text
}
</Badge>
</div>
<div className="flex flex-row gap-2">
{outgoing ? (
<Badge
variant="outline"
className="bg-gray-100 text-gray-800"
>
<CareIcon
icon="l-arrow-to-right"
className="mr-2 h-4 w-4"
/>
{resource.assigned_facility?.name}
</Badge>
) : (
<Badge
variant="outline"
className="bg-gray-100 text-gray-800"
>
<CareIcon
icon="l-arrow-from-right"
className="mr-2 h-4 w-4"
/>
{resource.origin_facility?.name}
</Badge>
)}
</div>
</CardContent>
<CardFooter className="flex flex-col p-0">
<Separator className="my-2" />
<Link
href={`/facility/${resource.origin_facility.id}/resource/${resource.id}`}
className="items-center self-end p-2 pb-3 text-sm text-primary hover:underline text-right flex justify-end group-hover:translate-x-1 transition-transform"
>
View Details
<CareIcon icon="l-arrow-right" className="ml-1 h-4 w-4" />
</Link>
</CardFooter>
</Card>
))}
{queryResources?.count &&
Expand Down
6 changes: 5 additions & 1 deletion src/components/ui/sidebar/facility-nav.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,11 @@ function generateFacilityLinks(
icon: "d-patient",
},
{ name: t("encounters"), url: `${baseUrl}/encounters`, icon: "d-patient" },
{ name: t("resource"), url: "/resource", icon: "d-book-open" },
{
name: t("resource"),
url: `${baseUrl}/resource`,
icon: "d-book-open",
},
{ name: t("users"), url: `${baseUrl}/users`, icon: "d-people" },
{
name: t("settings"),
Expand Down

0 comments on commit d3580a9

Please sign in to comment.