fix(libs): Revise file structure for client and server components

apps/payments/next/Gruntfile.js

@@ -6,7 +6,7 @@ module.exports = function (grunt) {
   const srcPaths = [
     '.license.header',
     'app/**/*.ftl',
-    '../../../libs/payments/ui/src/lib/**/*.ftl'
+    '../../../libs/payments/ui/src/lib/**/*.ftl',
   ];
 
   grunt.initConfig({
@@ -31,9 +31,9 @@ module.exports = function (grunt) {
       // Call the Payments Next route to restart and reinitialize the Nest App.
       nestapp: {
         options: {
-          url: 'http://localhost:3035/api/dev/nestapp/restart'
-        }
-      }
+          url: 'http://localhost:3035/api/dev/nestapp/restart',
+        },
+      },
     },
     watch: {
       ftl: {
@@ -46,13 +46,13 @@ module.exports = function (grunt) {
       nestapp: {
         files: [
           '../../../libs/payments/**/*.ts',
-          '../../../libs/shared/**/*.ts'
+          '../../../libs/shared/**/*.ts',
         ],
         tasks: ['http:nestapp'],
         options: {
           interrupt: true,
         },
-      }
+      },
     },
     // Allows for multiple watchers tasks to be run concurrently.
     concurrent: {
@@ -60,9 +60,9 @@ module.exports = function (grunt) {
         logConcurrentOutput: true,
       },
       dev: {
-        tasks: ['watch:nestapp', 'watch:ftl']
-      }
-    }
+        tasks: ['watch:nestapp', 'watch:ftl'],
+      },
+    },
   });
 
   grunt.loadNpmTasks('grunt-contrib-copy');
@@ -74,4 +74,3 @@ module.exports = function (grunt) {
   grunt.registerTask('merge-ftl', ['copy:branding-ftl', 'concat:ftl']);
   grunt.registerTask('watchers', ['concurrent:dev']);
 };
-

libs/payments/ui/src/lib/client/components/CheckoutForm/index.tsx

@@ -15,10 +15,10 @@ import Image from 'next/image';
 import { useRouter } from 'next/navigation';
 import { useEffect, useState } from 'react';
 import LockImage from '@fxa/shared/assets/images/lock.svg';
-import { CheckoutCheckbox } from './CheckoutCheckbox';
-import { PrimaryButton } from './PrimaryButton';
-import { checkoutCartWithStripe } from '../../actions/checkoutCartWithStripe';
-import { handleStripeErrorAction } from '../../actions/handleStripeError';
+import { CheckoutCheckbox } from '../CheckoutCheckbox';
+import { PrimaryButton } from '../PrimaryButton';
+import { checkoutCartWithStripe } from '../../../actions/checkoutCartWithStripe';
+import { handleStripeErrorAction } from '../../../actions/handleStripeError';
 
 interface CheckoutFormProps {
   cmsCommonContent: {

libs/payments/ui/src/lib/client/components/PaymentSection/index.tsx

@@ -4,8 +4,8 @@
 
 'use client';
 
-import { CheckoutForm } from './CheckoutForm';
-import { StripeWrapper } from './StripeWrapper';
+import { CheckoutForm } from '../CheckoutForm';
+import { StripeWrapper } from '../StripeWrapper';
 
 interface PaymentFormProps {
   cmsCommonContent: {

libs/payments/ui/src/lib/server/components/PurchaseDetails/index.tsx

@@ -5,7 +5,7 @@
 import Image from 'next/image';
 import { Invoice } from '@fxa/payments/cart';
 import { LocalizerRsc } from '@fxa/shared/l10n/server';
-import { formatPlanPricing } from '../utils/helpers';
+import { formatPlanPricing } from '../../../utils/helpers';
 
 type ListLabelItemProps = {
   labelLocalizationId: string;
@@ -96,8 +96,12 @@ export async function PurchaseDetails(props: PurchaseDetailsProps) {
               },
               formatPlanPricing(listAmount, currency, interval)
             )}
-             • 
-            {subtitle}
+            {subtitle && (
+              <span>
+                &nbsp;&bull;&nbsp;
+                {subtitle}
+              </span>
+            )}
           </p>
         </div>
       </div>

libs/payments/ui/src/lib/server/components/TermsAndPrivacy/index.tsx

@@ -9,7 +9,7 @@ import {
   buildFirefoxAccountsTerms,
   buildPaymentTerms,
   buildProductTerms,
-} from '../utils/terms-and-privacy';
+} from '../../../utils/terms-and-privacy';
 import { LocalizerRsc } from '@fxa/shared/l10n/server';
 
 type GenericTermsProps = {

libs/payments/ui/src/server.ts

@@ -6,10 +6,10 @@
 export * from './lib/nestapp/app';
 export * from './lib/nestapp/config';
 export * from './lib/config.utils';
-export * from './lib/server/purchase-details';
-export * from './lib/server/subscription-title';
-export * from './lib/server/terms-and-privacy';
-export * from './lib/server/LoadingSpinner';
+export * from './lib/server/components/LoadingSpinner';
+export * from './lib/server/components/PurchaseDetails';
+export * from './lib/server/components/SubscriptionTitle';
+export * from './lib/server/components/TermsAndPrivacy';
 export * from './lib/utils/types';
 export { fetchCMSData } from './lib/actions/fetchCMSData';
 export { handleStripeErrorAction } from './lib/actions/handleStripeError';