reorder ui options (transcend-io#169)

* reorder ui options
goshippo · Jun 25, 2024 · 777d10c · 777d10c
1 parent cdf3fb8
commit 777d10c
Show file tree

Hide file tree

Showing 9 changed files with 26 additions and 23 deletions.
diff --git a/package.json b/package.json
@@ -7,7 +7,7 @@
     "url": "https://github.com/transcend-io/consent-manager-ui.git"
   },
   "homepage": "https://github.com/transcend-io/consent-manager-ui",
-  "version": "4.15.0",
+  "version": "4.15.1",
   "license": "MIT",
   "main": "build/ui",
   "files": [

diff --git a/src/components/AcceptAllOrMoreChoices.tsx b/src/components/AcceptAllOrMoreChoices.tsx
@@ -67,15 +67,15 @@ export function AcceptAllOrMoreChoices({
         role="group"
         aria-label={formatMessage(messages.buttonGroupAriaDescription)}
       >
+        <Button
+          primaryText={formatMessage(messages.acceptAllButtonPrimary)}
+          handleClick={handleAcceptAll}
+        />
         <Button
           primaryText={formatMessage(messages.moreChoicesButtonPrimary)}
           handleClick={handleMoreChoices}
           initialFocus
         />
-        <Button
-          primaryText={formatMessage(messages.acceptAllButtonPrimary)}
-          handleClick={handleAcceptAll}
-        />
       </div>
     </div>
   );

diff --git a/src/components/AcceptOrRejectAdvertising.tsx b/src/components/AcceptOrRejectAdvertising.tsx
@@ -50,21 +50,21 @@ export function AcceptOrRejectAdvertising({
         aria-label={formatMessage(messages.buttonGroupAriaDescription)}
       >
         <Button
-          primaryText={formatMessage(messages.rejectAdvertising)}
+          primaryText={formatMessage(messages.acceptAdvertising)}
           handleClick={(event) => {
             event.preventDefault();
-            airgap.setConsent(event, { Advertising: false }, CONSENT_OPTIONS);
+            airgap.setConsent(event, { Advertising: true }, CONSENT_OPTIONS);
             handleSetViewState('close');
           }}
-          initialFocus
         />
         <Button
-          primaryText={formatMessage(messages.acceptAdvertising)}
+          primaryText={formatMessage(messages.rejectAdvertising)}
           handleClick={(event) => {
             event.preventDefault();
-            airgap.setConsent(event, { Advertising: true }, CONSENT_OPTIONS);
+            airgap.setConsent(event, { Advertising: false }, CONSENT_OPTIONS);
             handleSetViewState('close');
           }}
+          initialFocus
         />
       </div>
     </div>

diff --git a/src/components/AcceptOrRejectAll.tsx b/src/components/AcceptOrRejectAll.tsx
@@ -68,15 +68,15 @@ export function AcceptOrRejectAll({
         role="group"
         aria-label={formatMessage(messages.buttonGroupAriaDescription)}
       >
+        <Button
+          primaryText={formatMessage(messages.acceptAllButtonPrimary)}
+          handleClick={handleAcceptAll}
+        />
         <Button
           primaryText={formatMessage(messages.rejectAllButtonPrimary)}
           handleClick={handleRejectAll}
           initialFocus
         />
-        <Button
-          primaryText={formatMessage(messages.acceptAllButtonPrimary)}
-          handleClick={handleAcceptAll}
-        />
       </div>
     </div>
   );

diff --git a/src/components/AcceptOrRejectAllOrMoreChoices.tsx b/src/components/AcceptOrRejectAllOrMoreChoices.tsx
@@ -78,15 +78,15 @@ export function AcceptOrRejectAllOrMoreChoices({
         role="group"
         aria-label={formatMessage(messages.buttonGroupAriaDescription)}
       >
+        <Button
+          primaryText={formatMessage(messages.acceptAllButtonPrimary)}
+          handleClick={handleAcceptAll}
+        />
         <Button
           primaryText={formatMessage(messages.rejectAllButtonPrimary)}
           handleClick={handleRejectAll}
           initialFocus
         />
-        <Button
-          primaryText={formatMessage(messages.acceptAllButtonPrimary)}
-          handleClick={handleAcceptAll}
-        />
         <Button
           primaryText={formatMessage(messages.moreChoicesButtonPrimary)}
           handleClick={handleMoreChoices}

diff --git a/src/components/AcceptOrRejectAnalytics.tsx b/src/components/AcceptOrRejectAnalytics.tsx
@@ -50,21 +50,21 @@ export function AcceptOrRejectAnalytics({
         aria-label={formatMessage(messages.buttonGroupAriaDescription)}
       >
         <Button
-          primaryText={formatMessage(messages.rejectAnalytics)}
+          primaryText={formatMessage(messages.acceptAnalytics)}
           handleClick={(event) => {
             event.preventDefault();
-            airgap.setConsent(event, { Analytics: false }, CONSENT_OPTIONS);
+            airgap.setConsent(event, { Analytics: true }, CONSENT_OPTIONS);
             handleSetViewState('close');
           }}
-          initialFocus
         />
         <Button
-          primaryText={formatMessage(messages.acceptAnalytics)}
+          primaryText={formatMessage(messages.rejectAnalytics)}
           handleClick={(event) => {
             event.preventDefault();
-            airgap.setConsent(event, { Analytics: true }, CONSENT_OPTIONS);
+            airgap.setConsent(event, { Analytics: false }, CONSENT_OPTIONS);
             handleSetViewState('close');
           }}
+          initialFocus
         />
       </div>
     </div>

diff --git a/src/components/CompleteOptions.tsx b/src/components/CompleteOptions.tsx
@@ -132,6 +132,7 @@ export function CompleteOptions({
           handleClick={handleSave}
           primaryText={formatMessage(completeOptionsMessages.saveButtonPrimary)}
           type="submit"
+          {...(orderedSelections.length === 0 ? { initialFocus: true } : {})}
         />
       </form>
     </div>

diff --git a/src/components/CompleteOptionsInverted.tsx b/src/components/CompleteOptionsInverted.tsx
@@ -128,6 +128,7 @@ export function CompleteOptionsInverted({
         <Button
           handleClick={handleSave}
           primaryText={formatMessage(completeOptionsMessages.saveButtonPrimary)}
+          {...(orderedSelections.length === 0 ? { initialFocus: true } : {})}
         />
       </form>
     </div>

diff --git a/src/components/CompleteOptionsToggles.tsx b/src/components/CompleteOptionsToggles.tsx
@@ -77,6 +77,7 @@ export function CompleteOptionsToggles({
         }}
         className="complete-options-toggle-close"
         fontColor={fontColor}
+        {...(orderedSelections.length === 0 ? { initialFocus: true } : {})}
       />
       <div>
         <div>
-Original file line number
+Diff line change
@@ Expand Up / @@ -128,6 +128,7 @@ export function CompleteOptionsInverted({ @@
             <Button
               handleClick={handleSave}
               primaryText={formatMessage(completeOptionsMessages.saveButtonPrimary)}
+              {...(orderedSelections.length === 0 ? { initialFocus: true } : {})}
             />
           </form>
         </div>
@@ Expand Down @@