Staging

.eleventy.js

@@ -155,8 +155,38 @@ module.exports = function (config) {
     });
   }
 
-  config.addLiquidShortcode("getStateFromDates", getStateFromDates);
+  // Get Date and Time as Seconds
+  // Datetime format: YYYY-MM-DD HH:MM
+  config.addLiquidShortcode("getDateTimeinSeconds", getDateTimeinSeconds);
+  function getDateTimeinSeconds(datetime) {
+    // Split the datetime string into date and time parts
+    const dateParts = datetime.split(" ");
+    const date = dateParts[0];
+    const time = dateParts[1];
+
+    // Extract hours, minutes, and AM/PM
+    let hours = parseInt(time.slice(0, time.length - 2).split(":")[0], 10); // Adjusted to capture full hour
+    const minutes = time.length === 6 ? time.slice(2, 4) : time.slice(3, 5);
+    const amPm = time.slice(-2).toLowerCase(); // Handle AM/PM case
+
+    // Convert hours to 24-hour format
+    if (amPm === "pm" && hours !== 12) {
+      hours += 12;
+    } else if (amPm === "am" && hours === 12) {
+      hours = 0;
+    }
+
+    // Format the datetime string for timestamp conversion
+    const formattedDatetime = `${date} ${String(hours).padStart(2, "0")}:${minutes} EST`;
+
+    // Convert to timestamp (in seconds)
+    const timestamp = Math.floor(new Date(formattedDatetime).getTime() / 1000);
 
+    return timestamp;
+  }
+
+  // Get State From Dates
+  config.addLiquidShortcode("getStateFromDates", getStateFromDates);
   function getStateFromDates(opens, closes) {
     if (!opens && !closes) {
       return "unknown";
@@ -187,14 +217,16 @@ module.exports = function (config) {
   config.addFilter("sortByProp", sortByProp);
 
   config.addFilter("readableDate", (dateObj) => {
-    return DateTime.fromJSDate(dateObj, { zone: "utc" }).toFormat(
+    return DateTime.fromJSDate(dateObj, { zone: "America/New_York" }).toFormat(
       "dd LLL yyyy",
     );
   });
 
   // https://html.spec.whatwg.org/multipage/common-microsyntaxes.html#valid-date-string
   config.addFilter("htmlDateString", (dateObj) => {
-    return DateTime.fromJSDate(dateObj, { zone: "utc" }).toFormat("yyyy-LL-dd");
+    return DateTime.fromJSDate(dateObj, { zone: "America/New_York" }).toFormat(
+      "yyyy-LL-dd",
+    );
   });
 
   // Get the first `n` elements of a collection.

.github/ISSUE_TEMPLATE/bug_report_form.yml

@@ -0,0 +1,59 @@
+---
+name: Bug Report
+description: Use this form to submit bug reports
+projects:
+  - GSA-TTS/54
+labels:
+  - "bug"
+
+body:
+  - type: "markdown"
+    attributes:
+      value: >
+        This form is used to submit bug reports.  A bug is when
+        something's not working the way that it should.  If a
+        page says something and needs to say something else,
+        please use the Content Update form.
+
+  - type: "input"
+    id: "url"
+    attributes:
+      label: "URL"
+      description: "Where do you see the bug?"
+      placeholder: "URL"
+    validations:
+      required: true
+
+  - type: "textarea"
+    id: "current_behavior"
+    attributes:
+      label: "Current Behavior"
+      description: "This is the current behavior"
+      placeholder: "what it's doing now"
+    validations:
+      required: true
+
+  - type: "textarea"
+    id: "expected"
+    attributes:
+      label: "Expected Behavior"
+      description: "This is what is expected"
+      placeholder: "what the it should be doing"
+    validations:
+      required: true
+
+  - type: "textarea"
+    id: "reproduction_steps"
+    attributes:
+      label: "Steps to Reproduce Behavior"
+      description: "This is what is how to reproduce the bug"
+      placeholder: "how to make the bug show up"
+    validations:
+      required: true
+
+  - type: "textarea"
+    id: "comments"
+    attributes:
+      label: "Comments"
+      description: "Another other comments, notes, thoughts, etc."
+      placeholder: "comments"

.github/ISSUE_TEMPLATE/content_update_form.yml

@@ -13,7 +13,9 @@ body:
         This form is used to request content updates.  We'll need
         to know the URL / address of the page that the content is
         on (or should be on), what the content currently says,
-        and what the content should say.
+        and what the content should say.  Bugs -- when something
+        isn't working properly -- should be reported using the bug
+        reporting form.
 
   - type: "input"
     id: "url"

CODEOWNERS

@@ -23,4 +23,4 @@
 *.png @GSA-TTS/tts-website-content
 *.jpg @GSA-TTS/tts-website-content
 
-.github @GSA-TTS/tts-website-admins
+.github @GSA-TTS/tts-website-developers

_includes/footer.html

@@ -10,9 +10,6 @@
             mobile-lg:grid-col-6 mobile-lg:grid-gap-2
           "
         >
-          <div class="mobile-lg:grid-col-auto">
-            <img class="usa-footer__logo-img" src="/assets/img/logo-img.png" alt="" />
-          </div>
           <div class="mobile-lg:grid-col-auto">
             <p class="usa-footer__logo-heading">Technology Transformation Services</p>
             <p style="font-size: .875rem;"><strong>Built with:</strong> <a href="https://designsystem.digital.gov/whats-new/updates/2022/04/28/introducing-uswds-3-0/">USWDS 3</a> | <a href="https://cloud.gov/pages/">Cloud.gov Pages</a> | <a href="https://digital.gov/guides/dap/">Digital Analytics Program</a></p>

_includes/layouts/jointts/home.html

@@ -27,133 +27,20 @@ <h1>{{ title }}</h1>
     </div>
     <div class="grid-row grid-gap">
       <div class="desktop:grid-col-8 usa-prose">
+        <!-- Open Jobs -->
         <h2 id="open-positions">Open positions</h2>
         <p>We are hiring and will be sharing upcoming jobs and open positions as they are available.</p>
+        {% include "layouts/jointts/open-jobs.html" %}                    
 
-        <ul>
-          {% assign open_job_count = 0 %}
-          {% for pg in collections.jobs %}
-          {% capture state %}{% getStateFromDates pg.data.opens pg.data.closes %}{% endcapture %}
-            {% if state == "open" %}
-              {% unless pg.data.path contains 'template' %}
-                {% unless pg.data.path contains 'performance-profiles' %}
-                  {% assign open_job_count = open_job_count | plus: 1 %}
-                  <li>
-                    {% if pg.data.external_url %}
-                    <a href="{{ pg.data.external_url }}" target="_blank">{{ pg.data.title }}</a>
-                      {% else %}
-                      <a href="{{ pg.url | url }}">{{ pg.data.title }}</a>
-                    {% endif %}
-                   (Open now {% if pg.data.weeks_open %}for {% if pg.data.weeks < 52 %}{{ pg.data.weeks }}{% else %} one year or until all selections have been made{% endif %},{% endif %} through {{ pg.data.closes | date: '%A, %B %e, %Y at 11:59pm' }} ET)
-                   <!-- Info Sessions -->
-                   {% assign now = 'now' | date: "%s" %}
-                   {% assign future_sessions = false %}
-
-                   {% for session in pg.data.info_sessions %}
-                     {% assign session_date = session.date | date: "%s" %}
-                     {% if session_date > now %}
-                       {% assign future_sessions = true %}
-                       {% break %}
-                     {% endif %}
-                   {% endfor %}
-                   {% if future_sessions %}
-                     <aside class="usa-alert usa-alert-info">
-                       <div class="usa-alert-body">
-                         <p>Upcoming info sessions for {{ pg.data.title }}</p>
-                         <ul>
-                           {% for session in pg.data.info_sessions %}
-                             {% assign session_date = session.date | date: "%s" %}
-                             {% if session_date > now %}
-                               <li>
-                                 <p><a href="{{ session.link }}" target="_blank">{{ session.headline }}</a> at {{ session.time }}</p>
-                               </li>
-                             {% endif %}
-                           {% endfor %}
-                         </ul>
-                       </div>
-                     </aside>
-                   {% endif %}
-                  </li>
-                {% endunless %}
-              {% endunless %}
-            {% endif %}
-          {% endfor %}
-        </ul>
-
-        {% if open_job_count == 0 %}
-          <p>No open positions at this time. Sign up for <a href="/join/newsletter/">job alerts!</a></p>
-        {% endif %} 
-
+        <!-- Upcoming Jobs -->
         <h2>Upcoming positions</h2>
-        <ul>
-          {% assign upcoming_job_count = 0 %}
-
-          {% for pg in collections.jobs %}
-            {% capture state %}{% getStateFromDates pg.data.opens pg.data.closes %}{% endcapture %}
-
-            {% assign show_job = false %}
-
-            {% if pg.data.title != "" %}
-              {% if state == "upcoming" %}
-                {% assign show_job = true %}
-              {% elsif state == "unknown" %}
-                {% assign show_job = true %}
-              {% endif %}
-            {% endif %}
-
-            {% if show_job %}
-              {% assign upcoming_job_count = upcoming_job_count | plus: 1 %}
-              {% unless pg.data.path contains 'template' %}
-                {% unless pg.data.path contains 'performance-profiles' %}
-                  <li>
-                    {% if pg.data.external_url %}
-                      <a href="{{ pg.data.external_url }}">{{ pg.data.title }}</a>
-                    {% else %}
-                      <a href="{{ pg.url | url }}">{{ pg.data.title }}</a>
-                    {% endif %}
-
-                    <!-- Info Sessions -->
-                    {% assign now = 'now' | date: "%s" %}
-                    {% assign future_sessions = false %}
-
-                    {% for session in pg.data.info_sessions %}
-                      {% assign session_date = session.date | date: "%s" %}
-                      {% if session_date > now %}
-                        {% assign future_sessions = true %}
-                        {% break %}
-                      {% endif %}
-                    {% endfor %}
-                    {% if future_sessions %}
-                      <aside class="usa-alert usa-alert-info">
-                        <div class="usa-alert-body">
-                          <p>Upcoming info sessions for {{ pg.data.title }}</p>
-                          <ul>
-                            {% for session in pg.data.info_sessions %}
-                              {% assign session_date = session.date | date: "%s" %}
-                              {% if session_date > now %}
-                                <li>
-                                  <p><a href="{{ session.link }}" target="_blank">{{ session.headline }}</a> at {{ session.time }}</p>
-                                </li>
-                              {% endif %}
-                            {% endfor %}
-                          </ul>
-                        </div>
-                      </aside>
-                    {% endif %}
-                  </li>
-                {% endunless %}
-              {% endunless %}
-            {% endif %}
-          {% endfor %}
-        </ul>
-
-        {% if upcoming_job_count == 0 %}
-          <p>No upcoming positions at this time. Sign up for <a href="/join/newsletter/">job alerts!</a></p>
-        {% endif %}                      
+        {% include "layouts/jointts/upcoming-jobs.html" %}
 
+        <!-- Other Opportunities -->
         <h2>Other GSA Opportunities</h2>
         <p>Check out <a href="https://www.gsa.gov/about-us/find-apply-for-and-land-a-job-at-gsa">careers at GSA</a> and more <a href="https://www.usajobs.gov/Search/Results?j=2210&d=GS&p=1">Information Technology opportunities.</a></p>
 
+        <!-- Application Process -->
         <h2>Application process</h2>
         <p>
           We have an amazing recruitment team who will usher you from application to interview to onboarding with TTS.
@@ -164,29 +51,11 @@ <h2>Application process</h2>
           our Talent Team at <a href="mailto:joinTTS@gsa.gov">joinTTS@gsa.gov</a>.
         </p>
       </div>
-      <div class="desktop:grid-col-4 margin-top-4 desktop:margin-top-0">
-        <div class="usa-summary-box">
-          <div class="usa-summary-box__body">
-            <h3 class="usa-summary-box__heading">Find out more</h3>
-            <div class="usa-summary-box__text">
-              <p>Join us at one of our monthly online information sessions. Come learn more about working at TTS, available positions, and our application process. Register for a session below.</p>
-              <ul>
-                {% for session in sorted_info_sessions %}
-                  {% assign session_date = session.date | date: "%s" %}
-                  {% assign now = 'now' | date: "%s" %}
-                  {% if session_date > now %}
-                    <li class="info-session">
-                      <a target="_blank" href="{{ session.link }}" rel="noopener">{{ session.date | date: "%A, %B %d, %Y" }}</a>
-                      <p>{{ session.time-et }}</p>
-                      <p>({{ session.time-pt }})</p>
-                    </li>
-                  {% endif %}
-                {% endfor %}
-              </ul>
-            </div>
-          </div>
-        </div>
-      </div>
+
+      <!-- General Info Sessions -->
+      {% if sorted_info_sessions.size > 0 %}
+        {% include "layouts/jointts/info-sessions-sidebar.html" %}
+      {% endif %}
     </div>
   </div>
 </section>

_includes/layouts/jointts/info-sessions-sidebar.html

@@ -0,0 +1,37 @@
+<div class="desktop:grid-col-4 margin-top-4 desktop:margin-top-0">
+    <div class="usa-summary-box">
+      <div class="usa-summary-box__body">
+        <h3 class="usa-summary-box__heading">Find out more</h3>
+        <div class="usa-summary-box__text">
+          <p>Join us at one of our monthly online information sessions. Come learn more about working at TTS, available positions, and our application process. Register for a session below.</p>
+          <ul class="info-sessions-list">
+            {% for session in sorted_info_sessions %}
+              <!-- Format the date for comparison -->
+              {% assign session_date = session.date | date: "%Y-%m-%d" %}
+
+              <!-- Extract ET time range from session.time (e.g., "1:00-2:00pm ET") -->
+              {% assign time_et = session.time-et | split: " ET" %}
+
+              <!-- Extract start time and end time (e.g., "1:00pm" and "2:00pm") -->
+              {% assign session_end_time = time_et | split: "-" | last | strip %}
+
+              <!-- Combine the date with the start and end times -->
+              {% assign session_end_str = session_date | append: " " | append: session_end_time %}
+
+              {% capture sessionEndTimestamp %}{% getDateTimeinSeconds session_end_str %}{% endcapture %}
+
+              {% assign now = 'now' | date: "%s" %}
+
+              {% if sessionEndTimestamp > now %}
+                <li class="info-session" data-session-end-timestamp="{{ sessionEndTimestamp }}">
+                  <a target="_blank" href="{{ session.link }}" rel="noopener">{{ session.date | date: "%A, %B %d, %Y" }}</a>
+                  <p>{{ session.time-et }}</p>
+                  <p>({{ session.time-pt }})</p>
+                </li>
+              {% endif %}
+            {% endfor %}
+          </ul>
+        </div>
+      </div>
+    </div>
+  </div>