Merge branch 'main' into feature/registerbeforenext-oncomplete

complexdatacollective · Jan 12, 2024 · ea73871 · ea73871
2 parents 94fc619 + 90b3060
commit ea73871
Show file tree

Hide file tree

Showing 18 changed files with 130 additions and 114 deletions.
diff --git a/lib/interviewer/containers/ProtocolScreen.js b/lib/interviewer/containers/ProtocolScreen.js
@@ -54,7 +54,7 @@ const ProtocolScreen = () => {
 
   return (
     <motion.div
-      className="flex w-full flex-1 flex-row"
+      className="flex h-full w-full flex-1 flex-row"
       initial={{ opacity: 0 }}
       animate={{ opacity: 1 }}
     >

diff --git a/lib/interviewer/selectors/interface.js b/lib/interviewer/selectors/interface.js
@@ -1,7 +1,14 @@
 import { filter, includes, intersection } from 'lodash';
 import { getProtocolCodebook } from './protocol';
 import { getNetwork, getNetworkEdges, getNetworkNodes } from './network';
-import { getPromptOtherVariable, getStageSubject, stagePromptIds, getPromptVariable, getSubjectType } from './prop';
+import {
+  getPromptOtherVariable,
+  getStageSubject,
+  stagePromptIds,
+  getPropPromptId,
+  getPromptVariable,
+  getSubjectType,
+} from './prop';
 import { createSelector } from '@reduxjs/toolkit';
 import { getPromptIndex, getPrompts } from './session';
 
@@ -20,35 +27,38 @@ export const getNodeVariables = createSelector(
     const nodeInfo = codebook.node;
     return nodeInfo && nodeInfo[nodeType] && nodeInfo[nodeType].variables;
   },
-)
+);
 
 export const makeGetNodeVariables = () => getNodeVariables;
 
-export const makeGetVariableOptions = (includeOtherVariable = false) => createSelector(
-  getNodeVariables, getPromptVariable, getPromptOtherVariable,
-  (
-    nodeVariables,
-    promptVariable,
-    [promptOtherVariable, promptOtherOptionLabel, promptOtherVariablePrompt],
-  ) => {
-    const optionValues = nodeVariables[promptVariable].options || [];
-    const otherValue = {
-      label: promptOtherOptionLabel,
-      value: null,
-      otherVariablePrompt: promptOtherVariablePrompt,
-      otherVariable: promptOtherVariable,
-    };
-
-    return includeOtherVariable && promptOtherVariable
-      ? [...optionValues, otherValue]
-      : optionValues;
-  },
-);
+export const makeGetVariableOptions = (includeOtherVariable = false) =>
+  createSelector(
+    getNodeVariables,
+    getPromptVariable,
+    getPromptOtherVariable,
+    (
+      nodeVariables,
+      promptVariable,
+      [promptOtherVariable, promptOtherOptionLabel, promptOtherVariablePrompt],
+    ) => {
+      const optionValues = nodeVariables[promptVariable]?.options || [];
+      const otherValue = {
+        label: promptOtherOptionLabel,
+        value: null,
+        otherVariablePrompt: promptOtherVariablePrompt,
+        otherVariable: promptOtherVariable,
+      };
+
+      return includeOtherVariable && promptOtherVariable
+        ? [...optionValues, otherValue]
+        : optionValues;
+    },
+  );
 
 /**
  * makeNetworkEdgesForType()
  * Get the current prompt/stage subject, and filter the network by this edge type.
-*/
+ */
 
 export const getNetworkEdgesForType = createSelector(
   getNetworkEdges,
@@ -61,7 +71,7 @@ export const makeNetworkEdgesForType = () => getNetworkEdgesForType;
 /**
  * makeNetworkEntitiesForType()
  * Get the current prompt/stage subject, and filter the network by this entity type.
-*/
+ */
 export const getNetworkEntitiesForType = createSelector(
   getNetwork,
   getStageSubject,
@@ -84,7 +94,7 @@ export const makeNetworkEntitiesForType = () => getNetworkEntitiesForType;
 /**
  * makeNetworkNodesForType()
  * Get the current prompt/stage subject, and filter the network by this node type.
-*/
+ */
 
 export const getNetworkNodesForType = createSelector(
   getNetworkNodes,
@@ -98,37 +108,40 @@ export const makeNetworkNodesForType = () => getNetworkNodesForType;
 export const getStageNodeCount = createSelector(
   getNetworkNodesForType,
   stagePromptIds,
-  (nodes, promptIds) => filter(
-    nodes, (node) => intersection(node.promptIDs, promptIds).length > 0,
-  ).length,
+  (nodes, promptIds) =>
+    filter(nodes, (node) => intersection(node.promptIDs, promptIds).length > 0)
+      .length,
 );
 
 export const makeGetStageNodeCount = () => {
   return createSelector(
-    getNetworkNodesForType, stagePromptIds,
-    (nodes, promptIds) => filter(
-      nodes, (node) => intersection(node.promptIDs, promptIds).length > 0,
-    ).length,
+    getNetworkNodesForType,
+    stagePromptIds,
+    (nodes, promptIds) =>
+      filter(
+        nodes,
+        (node) => intersection(node.promptIDs, promptIds).length > 0,
+      ).length,
   );
 };
 
 /**
  * makeNetworkNodesForPrompt
  *
  * Return a filtered node list containing only nodes where node IDs contains the current promptId.
-*/
+ */
 
 export const getPromptId = createSelector(
   getPrompts,
   getPromptIndex,
   (prompts, promptIndex) => prompts[promptIndex].id,
-)
+);
 
 export const getNetworkNodesForPrompt = createSelector(
   getNetworkNodesForType,
   getPromptId,
   (nodes, promptId) => filter(nodes, (node) => includes(node.promptIDs, promptId)),
-)
+);
 
 export const makeNetworkNodesForPrompt = () => getNetworkNodesForPrompt;
 
@@ -137,11 +150,12 @@ export const makeNetworkNodesForPrompt = () => getNetworkNodesForPrompt;
  *
  * Same as above, except returns a filtered node list that **excludes** nodes that match the current
  * prompt's promptId.
-*/
+ */
 
 export const getNetworkNodesForOtherPrompts = createSelector(
   getNetworkNodesForType, getPromptId,
   (nodes, promptId) => filter(nodes, (node) => !includes(node.promptIDs, promptId)),
 );
 
-export const makeNetworkNodesForOtherPrompts = () => getNetworkNodesForOtherPrompts;
+export const makeNetworkNodesForOtherPrompts = () =>
+  getNetworkNodesForOtherPrompts;
diff --git a/lib/interviewer/styles/components/_pairing-code-input.scss b/lib/interviewer/styles/components/_pairing-code-input.scss
@@ -16,18 +16,18 @@
   }
 
   &__character {
-    --character-padding: .75rem;
+    --character-padding: 0.75rem;
 
     appearance: none;
-    border-radius: .25rem;
+    border-radius: 0.25rem;
     font-family: var(--code-font);
     font-size: 2rem;
     font-weight: medium;
     padding: var(--character-padding) 0;
     text-align: center;
     width: calc(1rem + var(--character-padding) * 2);
     border: 0;
-    margin: .25rem;
+    margin: 0.25rem;
 
     &:nth-of-type(4n) {
       margin-right: 1rem;
@@ -38,7 +38,7 @@
     }
 
     &--error {
-      background-color: var(--error);
+      background-color: var(--nc-error);
     }
   }
 }
diff --git a/lib/interviewer/styles/containers/_dyad-census.scss b/lib/interviewer/styles/containers/_dyad-census.scss
@@ -13,23 +13,23 @@
 @keyframes shake {
   10%,
   90% {
-    transform: translate3d(-.1rem, 0, 0);
+    transform: translate3d(-0.1rem, 0, 0);
   }
 
   20%,
   80% {
-    transform: translate3d(+.2rem, 0, 0);
+    transform: translate3d(+0.2rem, 0, 0);
   }
 
   30%,
   50%,
   70% {
-    transform: translate3d(-.4rem, 0, 0);
+    transform: translate3d(-0.4rem, 0, 0);
   }
 
   40%,
   60% {
-    transform: translate3d(+.4rem, 0, 0);
+    transform: translate3d(+0.4rem, 0, 0);
   }
 }
 
@@ -106,9 +106,9 @@
     padding: units.unit(2);
 
     &--invalid {
-      border-color: var(--error);
+      border-color: var(--nc-error);
       outline-offset: 0.75rem;
-      animation: shake 0.82s cubic-bezier(.36, .07, .19, .97) both;
+      animation: shake 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
     }
   }
 
@@ -136,9 +136,14 @@
     z-index: 1;
     width: 11rem;
     margin: 0 -1.5rem;
-    background: linear-gradient(to right, transparent 50%, var(--nc-background) 50%);
+    background: linear-gradient(
+      to right,
+      transparent 50%,
+      var(--nc-background) 50%
+    );
     background-size: 200% 100%;
-    transition: background var(--animation-duration-standard) var(--animation-easing);
+    transition: background var(--animation-duration-standard)
+      var(--animation-easing);
   }
 
   &__options-step {
@@ -157,10 +162,10 @@
       .boolean-option--selected {
         &.boolean-option {
           &--no {
-            border-color: var(--error);
+            border-color: var(--nc-error);
 
             .round-checkbox--checked {
-              background-color: var(--error);
+              background-color: var(--nc-error);
             }
           }
         }

diff --git a/lib/interviewer/styles/containers/_tie-strength-census.scss b/lib/interviewer/styles/containers/_tie-strength-census.scss
@@ -1,23 +1,23 @@
 @keyframes shake {
   10%,
   90% {
-    transform: translate3d(-.1rem, 0, 0);
+    transform: translate3d(-0.1rem, 0, 0);
   }
 
   20%,
   80% {
-    transform: translate3d(+.2rem, 0, 0);
+    transform: translate3d(+0.2rem, 0, 0);
   }
 
   30%,
   50%,
   70% {
-    transform: translate3d(-.4rem, 0, 0);
+    transform: translate3d(-0.4rem, 0, 0);
   }
 
   40%,
   60% {
-    transform: translate3d(+.4rem, 0, 0);
+    transform: translate3d(+0.4rem, 0, 0);
   }
 }
 
@@ -95,9 +95,9 @@
     min-width: 65vmin;
 
     &--invalid {
-      border-color: var(--error);
+      border-color: var(--nc-error);
       outline-offset: 0.75rem;
-      animation: shake 0.82s cubic-bezier(.36, .07, .19, .97) both;
+      animation: shake 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
     }
   }
 
@@ -125,9 +125,14 @@
     z-index: 1;
     width: 11rem;
     margin: 0 -1.5rem;
-    background: linear-gradient(to right, transparent 50%, var(--nc-background) 50%);
+    background: linear-gradient(
+      to right,
+      transparent 50%,
+      var(--nc-background) 50%
+    );
     background-size: 200% 100%;
-    transition: background var(--animation-duration-standard) var(--animation-easing);
+    transition: background var(--animation-duration-standard)
+      var(--animation-easing);
   }
 
   &__options-step {

diff --git a/lib/ui/styles/components/_dialog.scss b/lib/ui/styles/components/_dialog.scss
@@ -90,7 +90,7 @@
   }
 
   &--error {
-    border-color: var(--error);
+    border-color: var(--nc-error);
 
     .error__stack-trace {
       padding: unit(2);
@@ -99,5 +99,4 @@
       word-break: break-word;
     }
   }
-
 }
diff --git a/lib/ui/styles/components/cards/_protocol-card.scss b/lib/ui/styles/components/cards/_protocol-card.scss
@@ -17,10 +17,10 @@ $component: 'protocol-card';
   &--selected {
     &:before {
       content: '';
-      position:absolute;
-      top:0;
-      bottom:0;
-      left:0;
+      position: absolute;
+      top: 0;
+      bottom: 0;
+      left: 0;
       right: 0;
       border: 0.4rem solid var(--color-mustard);
       border-radius: var(--nc-border-radius);
@@ -158,10 +158,11 @@ $component: 'protocol-card';
   &--obsolete {
     .#{$component}__icon-section {
       color: #ff9dbb;
-      background: var(--error);
+      background: var(--nc-error);
     }
 
-    .protocol-name, .protocol-description {
+    .protocol-name,
+    .protocol-description {
       opacity: 0.35;
     }
   }