Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Initial nextjs api endpoint commit #46

Draft
wants to merge 1 commit into
base: main
Choose a base branch
from
+265 −138
Draft

Initial nextjs api endpoint commit #46

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
47 changes: 47 additions & 0 deletions src/frontend/components/view--goal-search--results.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,47 @@
import { FormEvent } from "react";
import { Search } from "@trussworks/react-uswds";

interface ViewGoalSearchResultsProps {

}

export function ViewGoalSearchResults({}: ViewGoalSearchResultsProps) {

return (
<div>
results
</div>
);
}

// {/* {displayGoals?.length ? (
// <ul className="usa-card-group">
// {displayGoals && displayGoals.map((goal) => (
// <li
// key={goal.id}
// className="usa-card tablet-lg:grid-col-6 desktop:grid-col-4"
// >
// <NodeGoalCard goal={goal} />
// </li>
// ))}
// </ul>
// ) : (
// <div className="usa-alert usa-alert--warning usa-alert--slim">
// <div className="usa-alert__body">
// <p className="usa-alert__text">
// No matching goals.
// </p>
// </div>
// </div>
// )}

// <div className="grid-row flex-justify-center margin-bottom-205">
// {offset < filteredGoalsCount &&
// <Button
// type="button"
// onClick={() => setOffset(offset + 9)}
// >
// Show more
// </Button>
// }
// </div> */}
196 changes: 123 additions & 73 deletions src/frontend/components/view--goal-search.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import { NodeGoalProps, ViewFilter } from "lib/types";
import { NodeGoalCard } from "./node--goal--card";
import { ViewGoalSearchFacet } from "./view--goal-search--facet";
import { ViewGoalSearchFulltext } from "./view--goal-search--fulltext";
import { ViewGoalSearchResults } from "./view--goal-search--results";

interface ViewGoalSearch {
goals: Array<NodeGoalProps>,
Expand All @@ -12,19 +13,62 @@ interface ViewGoalSearch {
total: number
}

async function getData(fulltext: string) {
const url = `/api/goal-search?fulltext=${fulltext}`;
try {
const response = await fetch(url);
if (!response.ok) {
throw new Error(`Response status: ${response.status}`);
}

const { data } = await response.json();
console.log(data);
return {
goals: data?.goalsGraphql1?.results ?? [],
filters: data?.goalsGraphql1?.filters ?? [],
total: data?.goalsGraphql1?.pageInfo?.total ?? 0,
description: data?.goalsGraphql1?.description ?? "",
};
} catch (error) {
console.error(error.message);
}

}

export default function GoalsSearchView({ filters, goals, total, description }: ViewGoalSearch) {
const [fulltext, setFulltext] = useState(filters[0].value ? filters[0].value : "")
const [facets] = useState([...Object.keys(filters[1].options)])
const [fulltext, setFulltext] = useState(filters[0]?.value ? filters[0].value : "")
const [displayGoals, setDisplayGoals] = useState(goals)
const [facets] = useState(filters[1] ? [...Object.keys(filters[1]?.options)] : [])
const [search, setSearch] = useState(false);
const [offset, setOffset] = useState(9);
const [activeTopics, setActiveTopics] = useState([])
const [notDisabledTopics, setNotDisabledTopics] = useState([])
const [filteredGoals, setFilteredGoals] = useState([...goals])
const [filteredGoalsCount, setFilteredGoalsCount] = useState(total)

function handleSearch(e: FormEvent) {
async function handleSearch(e: FormEvent) {
e.preventDefault()
setSearch(true)
const url = `/api/goal-search?fulltext=${fulltext}`;
try {
const response = await fetch(url);
if (!response.ok) {
throw new Error(`Response status: ${response.status}`);
}

const { data } = await response.json();
console.log(data)
setDisplayGoals(data?.goalsGraphql1?.results ?? [])
setFilteredGoalsCount(data?.goalsGraphql1?.pageInfo?.total ?? 0)
// console.log(data);
// return {
// goals: data?.goalsGraphql1?.results ?? [],
// filters: data?.goalsGraphql1?.filters ?? [],
// total: data?.goalsGraphql1?.pageInfo?.total ?? 0,
// description: data?.goalsGraphql1?.description ?? "",
// };
} catch (error) {
console.error(error.message);
}
}

function updateTopicFilters(topic) {
Expand All @@ -38,81 +82,86 @@ export default function GoalsSearchView({ filters, goals, total, description }:
setActiveTopics(currentFilters)
}

function filterGoals(resetOffset = false) {
let currentGoals = [...goals];
let notDisabled = []
if(fulltext.length > 0) {
currentGoals = currentGoals.filter((goal) => {
let hasFulltext = false;
const searchFields = [goal?.body?.value, goal.title];
searchFields.forEach((field) => {
if(field && field.toLowerCase().includes(fulltext.toLowerCase())) {
hasFulltext = true
if (goal.topics?.length) {
goal.topics.forEach((topic) => {
if(!notDisabled.includes(topic.name)) {
notDisabled.push(topic.name)
}
})
}
}
})
// function filterGoals(resetOffset = false) {
// console.log("dg", displayGoals)
// let currentGoals = [...displayGoals];
// let notDisabled = []
// // if(fulltext.length > 0) {
// // currentGoals = currentGoals.filter((goal) => {
// // let hasFulltext = false;
// // const searchFields = [goal?.body?.value, goal.title];
// // searchFields.forEach((field) => {
// // if(field && field.toLowerCase().includes(fulltext.toLowerCase())) {
// // hasFulltext = true
// // if (goal.topics?.length) {
// // goal.topics.forEach((topic) => {
// // if(!notDisabled.includes(topic.name)) {
// // notDisabled.push(topic.name)
// // }
// // })
// // }
// // }
// // })

if(hasFulltext ) {
// // if(hasFulltext ) {

return goal
} else {
return null
}
})
// // return goal
// // } else {
// // return null
// // }
// // })

}
// // }

if (activeTopics.length > 0) {
currentGoals = currentGoals.filter((goal) => {
let hasActiveTopic = false
if (!goal.topics) {
return null;
}
goal.topics.forEach((topic) => {
if(activeTopics.indexOf(topic.name) > -1) {
hasActiveTopic = true
}
})
if(hasActiveTopic) {
return goal
} else {
return null
}
})
}
// if (activeTopics.length > 0) {
// currentGoals = currentGoals.filter((goal) => {
// let hasActiveTopic = false
// if (!goal.topics) {
// return null;
// }
// goal.topics.forEach((topic) => {
// if(activeTopics.indexOf(topic.name) > -1) {
// hasActiveTopic = true
// }
// })
// if(hasActiveTopic) {
// return goal
// } else {
// return null
// }
// })
// }

setNotDisabledTopics(notDisabled)
setFilteredGoalsCount(currentGoals.length)
// setNotDisabledTopics(notDisabled)
// setFilteredGoalsCount(currentGoals.length)

if (resetOffset) {
currentGoals = currentGoals.slice(0, 9);
setOffset(9)
} else {
currentGoals = currentGoals.slice(0, offset);
}
setFilteredGoals(currentGoals)
setSearch(false)
}
// if (resetOffset) {
// currentGoals = currentGoals.slice(0, 9);
// setOffset(9)
// } else {
// currentGoals = currentGoals.slice(0, offset);
// }
// setFilteredGoals(currentGoals)
// setSearch(false)
// }

useEffect(() => {
if(search) {
filterGoals(true)
}
}, [search])
// useEffect(() => {
// if(search) {
// filterGoals(true)
// }
// }, [search])

useEffect(() => {
filterGoals(true)
}, [activeTopics])
// useEffect(() => {
// filterGoals(true)
// }, [activeTopics])

useEffect(() => {
filterGoals()
}, [offset])
// useEffect(() => {
// filterGoals()
// }, [offset])

// useEffect(() => {
// filterGoals()
// }, [displayGoals])

return (
<div>
Expand Down Expand Up @@ -149,9 +198,10 @@ export default function GoalsSearchView({ filters, goals, total, description }:
</div>
)}
</ul>
{filteredGoals?.length ? (
<ViewGoalSearchResults />
{/* {displayGoals?.length ? (
<ul className="usa-card-group">
{filteredGoals.map((goal) => (
{displayGoals && displayGoals.map((goal) => (
<li
key={goal.id}
className="usa-card tablet-lg:grid-col-6 desktop:grid-col-4"
Expand Down Expand Up @@ -179,7 +229,7 @@ export default function GoalsSearchView({ filters, goals, total, description }:
Show more
</Button>
}
</div>
</div> */}
</div>
);
}
85 changes: 58 additions & 27 deletions src/frontend/pages/api/node-queries.ts → src/frontend/lib/graphqlQueries.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
export const nodeQueries = {
export const graphqlQueries = {
nodeGoal: (path: string) => (
`query NodeGoalQuery {
route(path: "${path}") {
Expand Down Expand Up @@ -51,34 +51,65 @@ export const nodeQueries = {
}
}`
),
}

export const strategicPlanQueries = {
planNodeByAgency: (id: number) => (
`query StrategicPlansByAgency {
strategicPlansByAgencyGraphql1(filter: {field_agency_target_id: ${id}}) {
pageInfo {
total
}
results {
... on NodePlan {
id
title
link {
url
}
goals {
... on NodeGoal {
id
fieldId
title
goalType
path
`query StrategicPlansByAgency {
strategicPlansByAgencyGraphql1(filter: {field_agency_target_id: ${id}}) {
pageInfo {
total
}
results {
... on NodePlan {
id
title
link {
url
}
goals {
... on NodeGoal {
id
fieldId
title
goalType
path
}
}
}
}
}
}`
),
goalsView: (fulltext: string, facets: Array<string>) => (
`query GoalsQuery {
goalsGraphql1(filter: {
aggregated_field: "${fulltext}",
Topics: [${facets}],
}) {
pageInfo {
total
}
filters {
options
value
}
description
results {
... on NodeGoal {
id
title
path
body {
value
}

topics {
... on TermTopic {
id
name
}
}
}
}
}
}
}
}
}`
}`
),
}
Loading