SurveyResponse: add link under map to switch survey response view

FixMyBerlin · Apr 8, 2024 · 77d565e · 77d565e
1 parent 0d6d7b0
commit 77d565e
Show file tree

Hide file tree

Showing 2 changed files with 35 additions and 11 deletions.
diff --git a/src/pages/[projectSlug]/surveys/[surveyId]/responses/map/[surveyResponseId].tsx b/src/pages/[projectSlug]/surveys/[surveyId]/responses/map/[surveyResponseId].tsx
@@ -1,7 +1,9 @@
-import { BlitzPage, useParam } from "@blitzjs/next"
+import { BlitzPage, Routes, useParam } from "@blitzjs/next"
 import { useQuery } from "@blitzjs/rpc"
+import router from "next/router"
 import { Suspense } from "react"
 import { Spinner } from "src/core/components/Spinner"
+import { Link } from "src/core/components/links"
 import { PageHeader } from "src/core/components/pages/PageHeader"
 import { H2 } from "src/core/components/text"
 import { useSlugs } from "src/core/hooks"
@@ -71,15 +73,27 @@ export const SurveyResponseWithLocation = () => {
         <H2>Beiträge mit Ortsangabe </H2>
 
         <div className="flex flex-col lg:flex-row gap-2">
-          <section className="lg:w-[46%] shrink-0">
-            <SurveyFeedbackWithLocationOverviewMap
-              maptilerStyleUrl={maptilerStyleUrl}
-              defaultViewState={defaultViewState}
-              selectedSurveyResponse={selectedSurveyResponse}
-              surveyResponsesFeedbackPartWithLocation={surveyResponsesFeedbackPartWithLocation}
-              locationRef={locationRef!}
-            />
-          </section>
+          <div className="lg:w-[46%] shrink-0">
+            <section className="w-full lg:mb-6">
+              <SurveyFeedbackWithLocationOverviewMap
+                maptilerStyleUrl={maptilerStyleUrl}
+                defaultViewState={defaultViewState}
+                selectedSurveyResponse={selectedSurveyResponse}
+                surveyResponsesFeedbackPartWithLocation={surveyResponsesFeedbackPartWithLocation}
+                locationRef={locationRef!}
+              />
+            </section>
+            <Link
+              className="hidden lg:block"
+              href={Routes.SurveyResponsePage({
+                projectSlug: projectSlug!,
+                surveyId: surveyId!,
+                haslocation: "true",
+              })}
+            >
+              Alle verorteten Beiträge öffnen
+            </Link>
+          </div>
           <section className="rounded-md drop-shadow-md">
             <EditableSurveyResponseListItem
               key={selectedSurveyResponse?.id}
@@ -91,6 +105,16 @@ export const SurveyResponseWithLocation = () => {
             />
           </section>
         </div>
+        <Link
+          className="lg:hidden"
+          href={Routes.SurveyResponsePage({
+            projectSlug: projectSlug!,
+            surveyId: surveyId!,
+            haslocation: "true",
+          })}
+        >
+          Alle verorteten Beiträge öffnen
+        </Link>
       </div>
     </>
   )

diff --git a/src/survey-responses/components/feedback/EditableSurveyResponseFilterForm.tsx b/src/survey-responses/components/feedback/EditableSurveyResponseFilterForm.tsx
@@ -86,7 +86,7 @@ export function EditableSurveyResponseFilterForm<S extends z.ZodType<any, any>>(
           statuses: [...Object.keys(surveyResponseStatus)], // default: all checked
           topics: [...topics.map((t) => String(t.id)), "0"], // default: all checked
           hasnotes: "ALL", // default: radio "ALL"
-          haslocation: "ALL", // default: radio "ALL"
+          haslocation: queryHaslocation || "ALL", // default: radio "ALL"
           //@ts-expect-error
           categories: [...feedbackQuestion?.props?.responses.map((r: TResponse) => String(r.id))], // default: all checked
           searchterm: "",