feat: add content redactor to devMode

src/seqta/ui/dev/hideSensitiveContent.ts

@@ -0,0 +1,217 @@
+interface ElementConfig {
+  selector: string;
+  action: (element: Element) => void;
+}
+
+interface ContentConfig {
+  [key: string]: ElementConfig;
+}
+
+function getRandomElement(array: string[]): string {
+  return array[Math.floor(Math.random() * array.length)];
+}
+
+function generateMockUserCode(): string {
+  const numbers = Math.floor(1000 + Math.random() * 9000);
+  const letters = Math.floor(10000000 + Math.random() * 90000000);
+  return `${numbers} // ${letters}`;
+}
+
+function getRandomDate(): Date {
+  const start = new Date();
+  const end = new Date(start.getTime() + 60 * 24 * 60 * 60 * 1000); // 60 days from now
+  return new Date(start.getTime() + Math.random() * (end.getTime() - start.getTime()));
+}
+
+const contentConfig: ContentConfig = {
+  lessonTitle: { 
+    selector: '.day h2', 
+    action: (element) => { element.textContent = getRandomElement(mockData.subjects); }
+  },
+  teacher: { 
+    selector: '.day h3:first-of-type', 
+    action: (element) => { element.textContent = getRandomElement(mockData.teachers); }
+  },
+  classroom: { 
+    selector: '.day h3:last-of-type', 
+    action: (element) => { element.textContent = getRandomElement(mockData.classrooms); }
+  },
+  userName: { 
+    selector: '.userInfoName, .name', 
+    action: (element) => { element.textContent = getRandomElement(mockData.names); }
+  },
+  userCode: { 
+    selector: '.userInfoText > .userInfoCode', 
+    action: (element) => { element.textContent = generateMockUserCode(); }
+  },
+  assessmentTitle: { 
+    selector: '.upcoming-assessment .upcoming-assessment-title', 
+    action: (element) => { element.textContent = getRandomElement(mockData.assessmentTitles); }
+  },
+  assessmentSubject: { 
+    selector: '.upcoming-assessment .upcoming-details h5', 
+    action: (element) => { element.textContent = getRandomElement(mockData.subjects); }
+  },
+  noticeTitle: { 
+    selector: '.notice h3', 
+    action: (element) => { element.textContent = getRandomElement(mockData.notices); }
+  },
+  noticeContent: { 
+    selector: '.notice .contents', 
+    action: (element) => { element.textContent = 'Content has been redacted for privacy.'; }
+  },
+  upcomingCheckboxes: {
+    selector: '.upcoming-checkbox-container',
+    action: (element) => { element.firstChild!.textContent = 'SUBJ'; }
+  },
+  dates: { 
+    selector: '.upcoming-date-title h5, input[type="date"]', 
+    action: (element) => {
+      const randomDate = getRandomDate();
+      if (element instanceof HTMLInputElement) {
+        element.value = randomDate.toISOString().split('T')[0];
+      } else {
+        element.textContent = randomDate.toLocaleDateString('en-US', { weekday: 'long', day: 'numeric', month: 'long' });
+      }
+    }
+  },
+
+  messageSubject: {
+    selector: '.MessageList__subject___1NV5O',
+    action: (element) => { element.textContent = getRandomElement(mockData.messages.subjects); }
+  },
+
+  messageSender: {
+    selector: '.MessageList__value___1sN24',
+    action: (element) => { element.textContent = getRandomElement(mockData.messages.sender); }
+  },
+
+  messageRecipients: {
+    selector: '.MessageList__recipients___3hqpE .MessageList__value___1sN24',
+    action: (element) => { element.textContent = 'Recipient(s) Redacted'; }
+  },
+
+  messageDate: {
+    selector: '.MessageList__date___7muMb',
+    action: (element) => { element.textContent = getRandomDate().toLocaleDateString('en-US', { weekday: 'long', day: 'numeric', month: 'long' }); }
+  },
+  avatarImage: {
+    selector: '.Avatar__Avatar___gE5kx',
+    action: (element) => { 
+      if (element instanceof HTMLElement) {
+        element.style.removeProperty('background-image');
+        element.firstChild!.firstChild!.textContent = getRandomElement(mockData.names)[0];
+      }
+    }
+  },
+  notificationCount: {
+    selector: '.notifications__bubble___1EkSQ',
+    action: (element) => { element.textContent = Math.floor(Math.random() * 100).toString(); }
+  },
+  schoolName: {
+    selector: 'title',
+    action: (element) => { element.textContent = 'School Portal'; }
+  },
+  documentNames: {
+    selector: '.document td.title',
+    action: (element) => { element.textContent = 'Document Name Redacted'; }
+  },
+  forumTopics: {
+    selector: '#menu .sub ul li label',
+    action: (element) => { element.textContent = 'Forum Topic Redacted'; }
+  },
+  courseNames: {
+    selector: '#menu .sub ul li[data-colour] label',
+    action: (element) => { element.textContent = 'Course Name Redacted'; }
+  },
+  yearGroups: {
+    selector: '#menu .sub > ul > li > label',
+    action: (element) => { element.textContent = 'Year Group Redacted'; }
+  },
+  newsArticleTitle: {
+    selector: '.ArticleText a',
+    action: (element) => { element.textContent = 'News Article Title Redacted'; }
+  },
+  newsArticleContent: {
+    selector: '.ArticleText p',
+    action: (element) => { element.textContent = 'News Article Content Redacted'; }
+  },
+  userHouse: {
+    selector: '.userInfohouse',
+    action: (element) => { element.textContent = 'House'; }
+  }
+};
+
+const mockData = {
+  subjects: [
+    "Mathematics", "English", "Science", "History", "Geography", 
+    "Art", "Music", "Physical Education", "Chemistry", "Physics", 
+    "Biology", "Economics", "Business Studies", "French", "Spanish", 
+    "Computer Science", "Literature", "Environmental Studies", 
+    "Political Science", "Sociology"
+  ],
+  teachers: [
+    "Mr. Smith", "Mrs. Johnson", "Ms. Williams", "Dr. Brown", 
+    "Mr. Davis", "Mrs. Miller", "Mr. Wilson", "Ms. Moore", 
+    "Dr. Taylor", "Mrs. Anderson", "Mr. Garcia", "Mrs. Martinez", 
+    "Ms. Thompson", "Dr. Lee", "Mr. Robinson", "Mrs. Hall", 
+    "Ms. White", "Dr. Clark", "Mr. Lewis", "Mrs. King"
+  ],
+  classrooms: [
+    "A101", "B205", "C304", "D102", "E201", 
+    "F103", "G204", "H301", "I202", "J105", 
+    "K107", "L206", "M303", "N104", "O209"
+  ],
+  names: [
+    "John Doe", "Jane Smith", "Michael Johnson", "Emily Brown", 
+    "David Lee", "Sarah Davis", "Robert Wilson", "Lisa Taylor", 
+    "William Moore", "Jennifer Anderson", "Thomas Garcia", 
+    "Olivia Martinez", "Daniel Thompson", "Sophia Lee", 
+    "Matthew Robinson", "Ava Hall", "Jacob White", 
+    "Mia Clark", "James Lewis", "Lily King"
+  ],
+  assessmentTitles: [
+    "Mid-term Exam", "Final Project", "Research Paper", 
+    "Oral Presentation", "Lab Report", "Essay", 
+    "Group Assignment", "Portfolio Review", "Quiz", 
+    "Practical Test", "Class Presentation", 
+    "Online Assessment", "Case Study", "Field Report", 
+    "Peer Review", "Coding Challenge", "Math Test", 
+    "Literary Analysis", "Debate", "Design Project"
+  ],
+  notices: [
+    "School Assembly", "Excursion Reminder", "Fundraising Event", 
+    "Parent-Teacher Meetings", "Sports Day", "Book Fair", 
+    "Career Day", "Music Concert", "Art Exhibition", 
+    "Science Fair", "Holiday Celebration", "Community Service Day", 
+    "Graduation Ceremony", "Award Ceremony", "Workshop", 
+    "Open House", "Seminar", "Club Meeting", 
+    "Field Trip", "Cultural Festival"
+  ],
+  messages: {
+    subjects: [
+      "Mid-year Exams", "Science project due soon", "Mufti Day coming up!",
+      "School Assembly", "Excursion Reminder", "Fundraising Event",
+      "Parent-Teacher Meetings", "Sports Day", "Book Fair",
+      "Career Day", "Music Concert", "Art Exhibition",
+      "Science Fair", "Holiday Celebration", "Community Service Day",
+      "Graduation Ceremony", "Award Ceremony", "Workshop",
+      "Open House", "Seminar", "Club Meeting",
+      "Field Trip", "Cultural Festival"
+    ],
+    sender: [
+      "Mr. Smith", "Mrs. Johnson", "Ms. Williams", "Dr. Brown", 
+      "Mr. Davis", "Mrs. Miller", "Mr. Wilson", "Ms. Moore", 
+      "Dr. Taylor", "Mrs. Anderson", "Mr. Garcia", "Mrs. Martinez", 
+    ]
+  }
+};
+
+export default function hideSensitiveContent() {
+  Object.entries(contentConfig).forEach(([_, { selector, action }]) => {
+    const elements = document.querySelectorAll(selector);
+    elements.forEach((element: Element) => {
+      action(element);
+    });
+  });
+}

src/seqta/utils/listeners/MessageListener.ts

@@ -11,6 +11,7 @@ import { disableTheme } from '../../ui/themes/disableTheme';
 import { CloseThemeCreator, OpenThemeCreator } from '../../ui/ThemeCreator';
 import ShareTheme from '../../ui/themes/shareTheme';
 import sendThemeUpdate from '../sendThemeUpdate';
+import hideSensitiveContent from '../../ui/dev/hideSensitiveContent';
 
 export class MessageHandler {
   constructor() {
@@ -102,6 +103,11 @@ export class MessageHandler {
         sendResponse({ status: 'success' });
         break;
 
+      case 'HideSensitive':
+        hideSensitiveContent();
+        sendResponse({ status: 'success' });
+        break;
+  
       default:
         console.debug('Unknown request info:', request.info);      
     }