feat: make the form analysis redirect to the correct localized result…

… page
cnumr · Nov 21, 2023 · 0b64876 · 0b64876
1 parent eeee23e
commit 0b64876
Show file tree

Hide file tree

Showing 11 changed files with 27 additions and 28 deletions.
diff --git a/assets/js/components/SiteAnalysisResult.js b/assets/js/components/SiteAnalysisResult.js
@@ -1,10 +1,7 @@
-import ResultRangeSlider from "./ResultRangeSlider";
-import AnalysisService from "../services/AnalysisService";
-import ResultCacheService from "../services/ResultCacheService";
-import { getUrlHostName } from "../helpers/urlUtils";
-
-import { clamp, getPercentFromRange } from "../helpers/mathUtils";
 import { camelize } from "../helpers/stringUtils";
+import { getUrlHostName } from "../helpers/urlUtils";
+import AnalysisService from "../services/AnalysisService";
+import ResultRangeSlider from "./ResultRangeSlider";
 
 /**
  * @typedef ResultRelativeTextData
@@ -55,7 +52,8 @@ class SiteAnalysisResult {
 			// NOTE : url params example to test : "?id=ec839aca-7c12-42e8-8541-5f7f94c36b7f
 		} else if (urlParams.has("id")) {
 			const id = urlParams.get("id");
-			pageResultData = await AnalysisService.fetchAnalysisById(id);
+			// window.location.pathname is something like /resultat (in french) or /en/result (in english)
+			pageResultData = await AnalysisService.fetchAnalysisById(id, window.location.pathname);
 		} else {
 			// TODO: redirect to error page or show dialog ?
 			window.location = `${window.location.origin}/erreur/?status=404`;

diff --git a/assets/js/helpers/routing.js b/assets/js/helpers/routing.js
@@ -4,8 +4,8 @@
  * Redirects to the results page given an analysis id (retrieved from back-end)
  *
  * @param {string} analysisId EcoIndex analyis identifier
+ * @param {string} resultUrlPrefix Results page prefix URL
  */
-export function redirectToResults(analysisId) {
-	// TODO: get lang relative url
-	window.location = `${window.location.origin}/resultat/?id=${analysisId}`;
+export function redirectToResults(analysisId, resultUrlPrefix) {
+	window.location = `${window.location.origin}${resultUrlPrefix}?id=${analysisId}`;
 }
diff --git a/assets/js/index.js b/assets/js/index.js
@@ -114,13 +114,14 @@ function initSubmitUrlForm() {
 		e.preventDefault();
 
 		const url = e.target.querySelector("input[name='siteurl']").value;
-		launchAnalysisByURL(url);
+		const resultUrlPrefix = form.getAttribute("action")
+		launchAnalysisByURL(url, resultUrlPrefix);
 	});
 }
 
-async function launchAnalysisByURL(url) {
+async function launchAnalysisByURL(url, resultUrlPrefix) {
 	try {
-		await AnalysisService.launchAnalysisByURL(url);
+		await AnalysisService.launchAnalysisByURL(url, resultUrlPrefix);
 		updateFormMessages({ success: true });
 	} catch (error) {
 		updateFormMessages({ success: false, error });

diff --git a/assets/js/services/AnalysisService.js b/assets/js/services/AnalysisService.js
@@ -5,7 +5,7 @@ import ResultCacheService from "./ResultCacheService";
 import { redirectToResults } from "../helpers/routing";
 
 class AnalysisService {
-	async launchAnalysisByURL(url) {
+	async launchAnalysisByURL(url, resultUrlPrefix) {
 		// If the given url parameter is only a domain name,
 		// let's transform it to a full URL by prepending "https://" to it
 		const domainNameRegex =
@@ -30,7 +30,7 @@ class AnalysisService {
 
 							if (taskResult.status === "SUCCESS" && ecoindex.status === "SUCCESS") {
 								ResultCacheService.add(ecoindex.detail);
-								redirectToResults(taskId);
+								redirectToResults(taskId, resultUrlPrefix);
 							}
 
 							if (taskResult.status === "SUCCESS" && ecoindex.status === "FAILURE") {
@@ -56,7 +56,7 @@ class AnalysisService {
 		}
 	}
 
-	async fetchAnalysisById(id) {
+	async fetchAnalysisById(id, pathname) {
 		// Check local storage: if analysis results object exist returns it
 		let apiResult = ResultCacheService.get(id);
 		if (apiResult) {
@@ -70,7 +70,7 @@ class AnalysisService {
 				(result) => {
 					apiResult = result;
 					ResultCacheService.add(result);
-					redirectToResults(result.id);
+					redirectToResults(result.id, pathname);
 					EcoIndexDialog.close();
 				},
 				(e) => {

diff --git a/config/_default/menu.toml b/config/_default/menu.toml
@@ -1,6 +1,6 @@
 [[footer]]
 	identifier = "github"
-	title = "Github"
+	title = "GitHub"
 	url = "https://github.com/cnumr/Ecoindex/"
 	weight = 10
 	[footer.params]

diff --git a/content/en/_home_widgets/_#first_test-url.md b/content/en/_home_widgets/_#first_test-url.md
@@ -2,8 +2,6 @@
 id = "test-url"
 +++
 
-Enter a website URL to discover the score:
-
-{{< ecoindex_form >}}
+{{< ecoindex_form action="/en/result" >}}
 
 More than 40,000 web pages already tested! [How does it work?](/en/how-it-works/)
diff --git a/content/fr/_home_widgets/_#first_test-url.md b/content/fr/_home_widgets/_#first_test-url.md
@@ -2,8 +2,6 @@
 id = "test-url"
 +++
 
-Entrez l’adresse d’une page web pour découvrir le score :
-
-{{< ecoindex_form >}}
+{{< ecoindex_form action="/resultat" >}}
 
 Déjà plus de 40 000 pages testées ! [Comment ça marche ?](/comment-ca-marche/)
diff --git a/i18n/en.toml b/i18n/en.toml
@@ -1,5 +1,7 @@
 [EcoIndexFormIntro]
 	other = "Enter a website URL to discover it!"
+[EcoIndexFormInputLabel]
+	other = "Enter a website URL to discover the score:"
 [EcoIndexFormPlaceholder]
 	other = "https://example.org"
 [EcoIndexFormSubmitText]

diff --git a/i18n/fr.toml b/i18n/fr.toml
@@ -1,5 +1,7 @@
 [EcoIndexFormIntro]
 	other = "Entrez l’adresse d’une page web pour le découvrir !"
+[EcoIndexFormInputLabel]
+	other = "Entrez l’adresse d’une page web pour découvrir le score :"
 [EcoIndexFormPlaceholder]
 	other = "https://exemple.org"
 [EcoIndexFormSubmitText]

diff --git a/layouts/partials/widgets/result-appreciation.html b/layouts/partials/widgets/result-appreciation.html
@@ -99,9 +99,7 @@ <h2 data-int="grade_title"></h2>
 				<div>
 					<a class="content-link" href="#score-details">
 						{{ i18n `SeeScoreDetails` }}
-						<span
-							><svg aria-hidden="true"><use xlink:href="#icon-anchor-down"></use></svg
-						></span>
+						<span><svg aria-hidden="true"><use xlink:href="#icon-anchor-down"></use></svg></span>
 					</a>
 				</div>
 			</div>

diff --git a/layouts/shortcodes/ecoindex_form.html b/layouts/shortcodes/ecoindex_form.html
@@ -1,7 +1,9 @@
-<form action="{{- ($.Page.GetPage `/loading`).RelPermalink -}}" method="post" class="stack-l js-analysis-submit-form">
+<form action="{{ if .Get "action" }}{{ .Get "action" }}{{ else }}{{- ($.Page.GetPage `/loading`).RelPermalink -}}{{ end }}" method="post" class="stack-l js-analysis-submit-form">
+	<label for="siteurl">{{ i18n `EcoIndexFormInputLabel` }}</label>
 	<div class="with-sidebar-l --right-side --p75">
 		<div>
 			<input
+				id="siteurl"
 				name="siteurl"
 				placeholder="{{ i18n `EcoIndexFormPlaceholder` }}"
 				required