[Data rearchitecture] sync with master

.rubocop.yml

@@ -108,6 +108,8 @@ Layout/HashAlignment:
   Enabled: false # Hashes look uglier when corrected
 Rails/I18nLocaleTexts:
   Enabled: false # Generally the translations are done manually so most times many language translations will be missing while the fallback message is English
+Style/StringConcatenation:
+  Enabled: false
 
 ########################
 # Temporary exceptions #
@@ -171,8 +173,6 @@ Style/DateTime:
   Enabled: false
 Rails/ContentTag:
   Enabled: false
-Style/StringConcatenation:
-  Enabled: false
 Style/OptionalBooleanParameter:
   Enabled: false
 Style/ExplicitBlockArgument:

CONTRIBUTING.md

@@ -36,6 +36,7 @@ If you're a new developer and you're looking for an easy way to get involved, tr
 - [MediaWiki API Sandbox](https://en.wikipedia.org/wiki/Special%3aApiSandbox)
 - [Quarry](http://quarry.wmflabs.org/): Public querying interface for the Labs replica database. Very useful for testing SQL queries and for figuring out what data is available.
 - [Guide to the front end](docs/frontend.md)
+- [Admin Guide](docs/admin_guide.md): Overview of the Dashboard infrastructure, including servers, tools, dependencies, and troubleshooting resources.
 - [Vagrant](https://github.com/marxarelli/wikied-vagrant): a configuration to quickly get a development environment up and running using Vagrant. If you already have VirtualBox and/or Vagrant on your machine, this might be a simple way to set up a dev environment. However, it is not actively maintained. If you try it and run into problems, let us know!
 
 #### Code Style

README.md

@@ -44,6 +44,7 @@ This project welcomes contributions, and we try to be as newbie-friendly as poss
 - [Interface strings & Internationalization](docs/i18n.md)
 - [OAuth setup](docs/oauth.md)
 - [Deployment](docs/deploy.md)
+- [Admin Guide](docs/admin_guide.md) - Overview of the Dashboard infrastructure, including servers, tools, dependencies, and troubleshooting resources.
 - [Tools & Integrations](docs/tools.md)
 - [Using Docker for development](docs/docker.md)
 - [Model diagram](erd.pdf)

app/assets/javascripts/actions/article_actions.js

@@ -1,24 +1,70 @@
 import * as types from '../constants';
 import API from '../utils/api.js';
+import { getRevisionRange } from '../utils/mediawiki_revisions_utils';
+import { find } from 'lodash-es';
 
 // This action uses the Thunk middleware pattern: instead of returning a plain
-// action object, it returns a function that takes the store dispatch fucntion —
+// action object, it returns a function that takes the store dispatch function —
 // which Thunk automatically provides — and can then dispatch a series of plain
 // actions to be handled by the store.
 // This is how actions with side effects — such as API calls — are handled in
 // Redux.
 export function fetchArticleDetails(articleId, courseId) {
-  return function (dispatch) {
+  return async function (dispatch, getState) {
     return API.fetchArticleDetails(articleId, courseId)
-      .then(response => (dispatch({
-        type: types.RECEIVE_ARTICLE_DETAILS,
-        articleId,
-        data: response
-      })))
+      .then((response) => {
+        const details = response.article_details;
+
+        return getRevisionRange(details.apiUrl, details.articleTitle, details.editors, details.startDate, details.endDate)
+          .then(async (revisionRange) => {
+            // If no revisions are found (both first and last revisions are missing),
+            // it may indicate a mismatch in the article title as the article was moved to a new title.
+            if (!revisionRange.first_revision && !revisionRange.last_revision) {
+              const { title: articleTitle, mw_page_id: article_mw_page_id } = find(
+                getState().articles.articles,
+                { id: articleId }
+              );
+
+              // Dispatch an action to cross-check the article title with its metadata.
+              const crossCheckedArticleTitle = await dispatch(crossCheckArticleTitle(articleId, articleTitle, article_mw_page_id));
+
+              // Re-fetch the article details using the cross-checked title for accuracy.
+              fetchArticleDetailsAgain(crossCheckedArticleTitle, articleId, courseId, dispatch);
+            } else {
+              dispatch({ type: types.RECEIVE_ARTICLE_DETAILS, articleId, details, revisionRange });
+            }
+          });
+      })
       .catch(response => (dispatch({ type: types.API_FAIL, data: response })));
   };
 }
 
+// Re-fetches article details using the corrected or cross-checked article title.
+// This function is used when the initial fetch fails to retrieve valid revision data,
+// likely due to a mismatch in the article title. It ensures the Redux store is updated
+// with accurate article details and revision ranges after the re-fetch.
+function fetchArticleDetailsAgain(crossCheckedArticleTitle, articleId, courseId, dispatch) {
+  return API.fetchArticleDetails(articleId, courseId)
+    .then((response) => {
+      const details = response.article_details;
+
+      // Calculate the revision range for the updated article title.
+      return getRevisionRange(
+        details.apiUrl,
+        crossCheckedArticleTitle,
+        details.editors,
+        details.startDate,
+        details.endDate
+      ).then((revisionRange) => {
+          // Dispatch the updated article details and revision range to Redux.
+          dispatch({ type: types.RECEIVE_ARTICLE_DETAILS, articleId, details, revisionRange });
+      });
+    })
+    .catch((response) => {
+      (dispatch({ type: types.API_FAIL, data: response }));
+    });
+}
+
 export function updateArticleTrackedStatus(articleId, courseId, tracked) {
   return function (dispatch) {
     return API.updateArticleTrackedStatus(articleId, courseId, tracked).then(response => (dispatch({
@@ -29,3 +75,37 @@ export function updateArticleTrackedStatus(articleId, courseId, tracked) {
     }))).catch(response => (dispatch({ type: types.API_FAIL, data: response })));
   };
 }
+
+export const crossCheckArticleTitle = (articleId, articleTitle, article_mw_page_id) => {
+  return async (dispatch) => {
+    try {
+      // Fetch the page title from Wikipedia API
+      const response = await fetch(
+        `https://en.wikipedia.org/w/api.php?action=query&pageids=${article_mw_page_id}&format=json&origin=*`
+      );
+
+      if (!response.ok) {
+        throw new Error(`API request failed with status ${response.status}`);
+      }
+
+      const apiResponse = await response.json();
+      const wikipediaArticleTitle = apiResponse.query.pages[article_mw_page_id]?.title;
+
+      if (wikipediaArticleTitle && wikipediaArticleTitle !== articleTitle) {
+        const baseUrl = 'https://en.wikipedia.org/wiki/';
+        const updatedUrl = `${baseUrl}${wikipediaArticleTitle.replace(/ /g, '_')}`;
+
+        dispatch({
+          type: types.UPDATE_ARTICLE_TITLE_AND_URL,
+          payload: { articleId, title: wikipediaArticleTitle, url: updatedUrl },
+        });
+
+        return wikipediaArticleTitle;
+      }
+
+      return articleTitle;
+    } catch (error) {
+      dispatch({ type: types.API_FAIL, data: error });
+    }
+  };
+};

app/assets/javascripts/actions/user_revisions_actions.js

@@ -1,30 +1,18 @@
 import { RECEIVE_USER_REVISIONS, API_FAIL } from '../constants';
-import logErrorMessage from '../utils/log_error_message';
-import request from '../utils/request';
+import { fetchLatestRevisionsForUser } from '../utils/mediawiki_revisions_utils';
 
-
-const fetchUserRevisionsPromise = async (courseId, userId) => {
-  const response = await request(`/revisions.json?user_id=${userId}&course_id=${courseId}`);
-  if (!response.ok) {
-    logErrorMessage(response);
-    const data = await response.text();
-    response.responseText = data;
-    throw response;
-  }
-  return response.json();
-};
-
-export const fetchUserRevisions = (courseId, userId) => (dispatch, getState) => {
+export const fetchUserRevisions = (course, user) => (dispatch, getState) => {
   // Don't refetch a user's revisions if they are already in the store.
-  if (getState().userRevisions[userId]) { return; }
+  if (getState().userRevisions[user.username]) { return; }
 
   return (
-    fetchUserRevisionsPromise(courseId, userId)
+    fetchLatestRevisionsForUser(user.username, course.home_wiki)
       .then((resp) => {
         dispatch({
           type: RECEIVE_USER_REVISIONS,
-          data: resp,
-          userId
+          revisions: resp,
+          username: user.username,
+          wiki: course.home_wiki
         });
       })
       .catch(response => (dispatch({ type: API_FAIL, data: response })))

app/assets/javascripts/components/campaign/campaign_stats_download_modal.jsx

@@ -5,7 +5,6 @@ const CampaignStatsDownloadModal = ({ campaign_slug }) => {
 
   const courseDataLink = `/campaigns/${campaign_slug}/courses.csv`;
   const articlesEditedLink = `/campaigns/${campaign_slug}/articles_csv.csv`;
-  const RevisionsLink = `/campaigns/${campaign_slug}/revisions_csv.csv`;
   const editorsLink = `/campaigns/${campaign_slug}/students.csv`;
   const editorsByCourseLink = `/campaigns/${campaign_slug}/students.csv?course=true`;
   const instructorsLink = `/campaigns/${campaign_slug}/instructors.csv?course=true`;
@@ -32,11 +31,6 @@ const CampaignStatsDownloadModal = ({ campaign_slug }) => {
         {I18n.t('campaign.data_articles_info')}
       </p>
       <hr />
-      <p>
-        <a href={RevisionsLink} className="button right">{I18n.t('campaign.data_revisions')}</a>
-        {I18n.t('campaign.data_revisions_info')}
-      </p>
-      <hr />
       <p>
         <a href={editorsLink} className="button right">{I18n.t('campaign.data_editor_usernames')}</a>
         {I18n.t('campaign.data_editor_usernames_info')}

app/assets/javascripts/components/common/ArticleViewer/containers/ArticleViewer.jsx

@@ -27,6 +27,7 @@ import colors from '@components/common/ArticleViewer/constants/colors';
 
 // Actions
 import { resetBadWorkAlert, submitBadWorkAlert } from '~/app/assets/javascripts/actions/alert_actions.js';
+import { crossCheckArticleTitle } from '@actions/article_actions';
 
 /*
   Quick summary of the ArticleViewer component's main logic
@@ -55,7 +56,11 @@ const ArticleViewer = ({ showOnMount, users, showArticleFinder, showButtonLabel,
   const [unhighlightedContributors, setUnhighlightedContributors] = useState([]);
   const [revisionId, setRevisionId] = useState(null);
   const [pendingRequest, setPendingRequest] = useState(false);
-  const lastRevisionId = useSelector(state => state.articleDetails[article.id]?.last_revision?.mw_rev_id);
+  const lastRevisionId = useSelector(state => state.articleDetails[article.id]?.last_revision?.revid);
+
+  // State to track whether the article title needs to be verified and updated
+  // (i.e., if a fetch failed due to the article title being moved)
+  const [checkArticleTitle, setCheckArticleTitle] = useState(false);
 
   const dispatch = useDispatch();
   const ref = useRef();
@@ -245,6 +250,8 @@ const ArticleViewer = ({ showOnMount, users, showArticleFinder, showButtonLabel,
         setFailureMessage(error.message);
         setFetched(true);
         setWhoColorFailed(true);
+        // Set flag to verify and fetch the article title if the fetch failed, possibly due to the article being moved
+        setCheckArticleTitle(true);
       });
   };
 
@@ -257,9 +264,32 @@ const ArticleViewer = ({ showOnMount, users, showArticleFinder, showButtonLabel,
       }).catch((error) => {
         setWhoColorFailed(true);
         setFailureMessage(error.message);
+        // Set flag to verify and fetch the article title if the fetch failed, possibly due to the article being moved
+        setCheckArticleTitle(true);
       });
   };
 
+  // Function to verify if the article title has changed and fetch updated data accordingly
+  const verifyAndFetchArticle = async () => {
+    // Dispatch an action to cross-check the current article title using its ID and MediaWiki page ID
+    const crossCheckedArticleTitle = await dispatch(crossCheckArticleTitle(article.id, article.title, article.mw_page_id));
+
+    if (crossCheckedArticleTitle === article.title) {
+      setWhoColorFailed(false); // Clear the failure state for WhoColor data
+      setCheckArticleTitle(false); // Stop further title verification checks
+      fetchParsedArticle(); // Re-fetch the parsed article content with the current title
+      fetchWhocolorHtml(); // Re-fetch the WhoColor HTML for the article using the current title
+    } else if (crossCheckArticleTitle !== article.title) {
+      setFetched(false); // Indicate a loading state until the Redux store updates the new article title and the component re-renders
+    }
+  };
+
+  // Trigger the article title verification and data fetching process if a previous fetch failed
+  if (checkArticleTitle) {
+    verifyAndFetchArticle();
+  }
+
+
   // These are mediawiki user ids, and don't necessarily match the dashboard
   // database user ids, so we must fetch them by username from the wiki.
   const fetchUserIds = () => {

app/assets/javascripts/components/common/AssignmentLinks/AssignmentLinks.jsx

@@ -59,9 +59,9 @@ const AssignmentLinks = ({ assignment, courseType, user, course, project, editMo
   let groupMembers;
   if (editors) {
     if (role === ASSIGNED_ROLE) {
-      groupMembers = <GroupMembersLink members={editors} />;
+      groupMembers = <GroupMembersLink members={editors} course={course} />;
     } else {
-      groupMembers = <EditorLink key={`editor-${id}`} editors={editors} />;
+      groupMembers = <EditorLink key={`editor-${id}`} editors={editors} course={course} />;
     }
   }
 
@@ -70,7 +70,6 @@ const AssignmentLinks = ({ assignment, courseType, user, course, project, editMo
     reviewers = <AllPeerReviewLinks assignment={assignment} />;
   }
 
-  // const reviewers = <ReviewerLink key={`reviewers-${id}`} reviewers={assignment.reviewers} />;
   const links = actions.reduce(interleaveSeparators, []);
 
   return (

app/assets/javascripts/components/common/AssignmentLinks/EditorLink.jsx

@@ -3,8 +3,8 @@ import PropTypes from 'prop-types';
 
 import AssignedToLink from '@components/overview/my_articles/common/AssignedToLink.jsx';
 
-export const EditorLink = ({ editors }) => {
-  return <AssignedToLink members={editors} name="editors" />;
+export const EditorLink = ({ editors, course }) => {
+  return <AssignedToLink members={editors} course={course} name="editors" />;
 };
 
 EditorLink.propTypes = {

app/assets/javascripts/components/common/AssignmentLinks/GroupMembersLink.jsx

@@ -1,10 +1,9 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-
 import AssignedToLink from '@components/overview/my_articles/common/AssignedToLink.jsx';
 
-export const GroupMembersLink = ({ members }) => {
-  return <AssignedToLink members={members} name="group_members" />;
+export const GroupMembersLink = ({ members, course }) => {
+  return <AssignedToLink members={members} course={course} name="group_members" />;
 };
 
 GroupMembersLink.propTypes = {

app/assets/javascripts/components/common/weekday_picker.jsx

@@ -25,7 +25,6 @@ const WeekdayPicker = ({
   style,
   tabIndex,
 
-  ariaModifier,
   modifiers,
 
   locale,
@@ -145,7 +144,7 @@ const WeekdayPicker = ({
 
     dayClassName += customModifiers.map(modifier => ` ${dayClassName}--${modifier}`).join('');
 
-    const ariaSelected = customModifiers.indexOf(ariaModifier) > -1;
+    const ariaSelected = customModifiers.indexOf('selected') > -1;
 
     let tabIndexValue = null;
     if (onWeekdayClick) {
@@ -159,10 +158,20 @@ const WeekdayPicker = ({
     const onMouseEnterHandler = onWeekdayMouseEnter ? e => handleWeekdayMouseEnter(e, weekday, customModifiers) : null;
     const onMouseLeaveHandler = onWeekdayMouseLeave ? e => handleWeekdayMouseLeave(e, weekday, customModifiers) : null;
 
+    const ariaLabelMessage = ariaSelected
+      ? I18n.t('weekday_picker.aria.weekday_selected', { weekday: localeUtils.formatWeekdayLong(weekday), })
+      : I18n.t('weekday_picker.aria.weekday_select', { weekday: localeUtils.formatWeekdayLong(weekday), });
+
+    const ariaLiveMessage = ariaSelected
+      ? I18n.t('weekday_picker.aria.weekday_selected', { weekday: localeUtils.formatWeekdayLong(weekday), })
+      : I18n.t('weekday_picker.aria.weekday_unselected', { weekday: localeUtils.formatWeekdayLong(weekday), });
+
     return (
       <button
-        key={weekday} className={dayClassName} tabIndex={tabIndexValue}
-        aria-pressed={ariaSelected}
+        key={weekday}
+        className={dayClassName}
+        tabIndex={tabIndexValue}
+        aria-label= {ariaLabelMessage}
         onClick={onClickHandler}
         onKeyDown={e => handleDayKeyDown(e, weekday, customModifiers)}
         onMouseEnter={onMouseEnterHandler}
@@ -171,6 +180,10 @@ const WeekdayPicker = ({
         <span title={localeUtils.formatWeekdayLong(weekday)}>
           {localeUtils.formatWeekdayShort(weekday)}
         </span>
+        {/* Aria-live region for screen reader announcements for confirmation of when a week day is selected or unselected */}
+        <div aria-live="assertive" aria-atomic="true" className="sr-WeekdayPicker-aria-live">
+          {ariaLiveMessage}
+        </div>
       </button>
     );
   };
@@ -201,7 +214,6 @@ WeekdayPicker.propTypes = {
   style: PropTypes.object,
   tabIndex: PropTypes.number,
 
-  ariaModifier: PropTypes.string,
   modifiers: PropTypes.object,
 
   locale: PropTypes.string,