Skip to content

Commit

Permalink
Merge branch 'main' into readme-update
Browse files Browse the repository at this point in the history
  • Loading branch information
danielnaab authored Nov 9, 2024
2 parents 5d180f9 + 402acdd commit a429f3c
Show file tree
Hide file tree
Showing 26 changed files with 897 additions and 171 deletions.
4 changes: 2 additions & 2 deletions apps/spotlight/src/lib/github.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ export type GithubRepository = {

export const DEFAULT_REPOSITORY: GithubRepository = {
owner: 'gsa-tts',
repository: 'atj-platform',
repository: 'forms',
branch: 'main',
commit: 'main',
};
Expand All @@ -28,7 +28,7 @@ export const getGithubRepository = async (
const { execSync } = await import('child_process');
return {
owner: env.OWNER || 'gsa-tts',
repository: env.REPOSITORY || 'atj-platform',
repository: env.REPOSITORY || 'forms',
branch: env.BRANCH || 'main',
commit: execSync('git rev-parse HEAD').toString().trim(),
};
Expand Down
4 changes: 0 additions & 4 deletions documents/podman-integration.md
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,6 @@ export TESTCONTAINERS_RYUK_DISABLED=true

After adding the above lines to your shell configuration file, apply the changes by reloading your shell configuration:


For Zsh:
```bash
source ~/.zshrc
Expand All @@ -86,7 +85,6 @@ pnpm test

If you're new to the team and need to start with Podman, follow these steps:


### Step 1: Install Podman

Install Podman using Homebrew:
Expand Down Expand Up @@ -122,7 +120,6 @@ export TESTCONTAINERS_RYUK_DISABLED=true

After adding the above lines to your shell configuration file, apply the changes by reloading your shell configuration:


For Zsh:
```bash
source ~/.zshrc
Expand Down Expand Up @@ -187,7 +184,6 @@ export PATH="$PNPM_HOME:$PATH"

Save the file and close the editor. Apply the changes by reloading your shell configuration:


For Zsh:
```bash
source ~/.zshrc
Expand Down
2 changes: 1 addition & 1 deletion infra/cdktf/__tests__/main-test.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import 'cdktf/lib/testing/adapters/jest';

describe('atj-platform app stack', () => {
describe('Forms Platform app stack', () => {
it.todo('should be tested');
});
2 changes: 1 addition & 1 deletion infra/cdktf/src/lib/cloud.gov/node-astro.ts
Original file line number Diff line number Diff line change
Expand Up @@ -72,7 +72,7 @@ export class AstroService extends Construct {
new cloudfoundry.app.App(this, `${id}-app`, {
name: `${id}-app`,
space: spaceId,
dockerImage: `ghcr.io/gsa-tts/atj-platform/${imageName}`,
dockerImage: `ghcr.io/gsa-tts/forms/${imageName}`,
memory: 1024,
diskQuota: 4096,
healthCheckType: 'http',
Expand Down
8 changes: 8 additions & 0 deletions packages/common/src/locales/en/app.ts
Original file line number Diff line number Diff line change
Expand Up @@ -52,5 +52,13 @@ export const en = {
fieldLabel: 'Select Dropdown label',
errorTextMustContainChar: 'String must contain at least 1 character(s)',
},
dateOfBirth: {
...defaults,
displayName: 'Date of Birth label',
fieldLabel: 'Date Of Birth label',
hintLabel: 'Date of Birth Hint label',
hint: 'For example: January 19 2000',
errorTextMustContainChar: 'String must contain at least 1 character(s)',
},
},
};
Original file line number Diff line number Diff line change
@@ -0,0 +1,88 @@
import React from 'react';
import { FormProvider, useForm } from 'react-hook-form';
import { type Meta, type StoryObj } from '@storybook/react';

import { DateOfBirthPattern } from './DateOfBirth.js';

const meta: Meta<typeof DateOfBirthPattern> = {
title: 'patterns/DateOfBirthPattern',
component: DateOfBirthPattern,
decorators: [
(Story, args) => {
const FormDecorator = () => {
const formMethods = useForm({
defaultValues: {
'date-of-birth-1.day': '',
'date-of-birth-1.month': '',
'date-of-birth-1.year': '',
},
});
return (
<FormProvider {...formMethods}>
<Story {...args} />
</FormProvider>
);
};
return <FormDecorator />;
},
],
tags: ['autodocs'],
};

export default meta;

export const Default: StoryObj<typeof DateOfBirthPattern> = {
args: {
_patternId: '',
type: 'date-of-birth',
monthId: 'date-of-birth-1.month',
dayId: 'date-of-birth-1.day',
yearId: 'date-of-birth-1.year',
label: 'Select a date of birth',
hint: 'For example: January 19, 2000',
required: false,
},
};

export const WithoutHint: StoryObj<typeof DateOfBirthPattern> = {
args: {
_patternId: '',
type: 'date-of-birth',
monthId: 'date-of-birth-1.month',
dayId: 'date-of-birth-1.day',
yearId: 'date-of-birth-1.year',
label: 'Select a date of birth',
hint: undefined,
required: false,
},
};

export const WithError: StoryObj<typeof DateOfBirthPattern> = {
args: {
_patternId: '',
type: 'date-of-birth',
monthId: 'date-of-birth-1.month',
dayId: 'date-of-birth-1.day',
yearId: 'date-of-birth-1.year',
label: 'Select a date of birth with error',
hint: 'For example: January 19, 2000',
required: false,
error: {
type: 'custom',
message: 'This field has an error',
},
},
};

export const Required: StoryObj<typeof DateOfBirthPattern> = {
args: {
_patternId: '',
type: 'date-of-birth',
monthId: 'date-of-birth-1.month',
dayId: 'date-of-birth-1.day',
yearId: 'date-of-birth-1.year',
label: 'Select a required date of birth',
hint: 'For example: January 19, 2000',
required: true,
},
};
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
/**
* @vitest-environment jsdom
*/
import { describeStories } from '../../../test-helper.js';
import meta, * as stories from './DateOfBirth.stories.js';

describeStories(meta, stories);
102 changes: 102 additions & 0 deletions packages/design/src/Form/components/DateOfBirth/DateOfBirth.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,102 @@
import React from 'react';
import { useFormContext } from 'react-hook-form';
import { type DateOfBirthProps } from '@atj/forms';
import { type PatternComponent } from '../../index.js';

const months = [
{ value: '01', label: 'January' },
{ value: '02', label: 'February' },
{ value: '03', label: 'March' },
{ value: '04', label: 'April' },
{ value: '05', label: 'May' },
{ value: '06', label: 'June' },
{ value: '07', label: 'July' },
{ value: '08', label: 'August' },
{ value: '09', label: 'September' },
{ value: '10', label: 'October' },
{ value: '11', label: 'November' },
{ value: '12', label: 'December' },
];

export const DateOfBirthPattern: PatternComponent<DateOfBirthProps> = ({
monthId,
dayId,
yearId,
label,
hint,
required,
error,
}) => {
const { register } = useFormContext();

return (
<fieldset className="usa-fieldset">
<legend className="usa-legend">
{label}
{required && <span className="required-indicator">*</span>}
</legend>
{hint && (
<span className="usa-hint" id="mdHint">
{hint}
</span>
)}
<div className="usa-memorable-date">
<div className="usa-form-group usa-form-group--month usa-form-group--select">
<label className="usa-label" htmlFor={monthId}>
Month
</label>
<select
className="usa-select"
id={monthId}
{...register(monthId)}
aria-describedby="mdHint"
>
<option key="default" value="">
- Select -
</option>
{months.map((option, index) => (
<option key={index} value={option.value}>
{option.label}
</option>
))}
</select>
</div>
<div className="usa-form-group usa-form-group--day">
<label className="usa-label" htmlFor={dayId}>
Day
</label>
<input
className="usa-input"
aria-describedby="mdHint"
id={dayId}
{...register(dayId)}
minLength={2}
maxLength={2}
pattern="[0-9]*"
inputMode="numeric"
/>
</div>
<div className="usa-form-group usa-form-group--year">
<label className="usa-label" htmlFor={yearId}>
Year
</label>
<input
className="usa-input"
aria-describedby="mdHint"
id={yearId}
{...register(yearId)}
minLength={4}
maxLength={4}
pattern="[0-9]*"
inputMode="numeric"
/>
</div>
</div>
{error && (
<span className="error-message" style={{ color: 'red' }}>
{error.message}
</span>
)}
</fieldset>
);
};
3 changes: 3 additions & 0 deletions packages/design/src/Form/components/DateOfBirth/index.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
import { DateOfBirthPattern } from './DateOfBirth.js';

export default DateOfBirthPattern;
Original file line number Diff line number Diff line change
Expand Up @@ -14,27 +14,25 @@ export const SelectDropdownPattern: PatternComponent<SelectDropdownProps> = ({
const { register } = useFormContext();
return (
<div className="usa-fieldset padding-top-2">
<form className="usa-form">
<label className="usa-label" htmlFor={selectId}>
{label}
{required && <span className="required-indicator">*</span>}
</label>
<select className="usa-select" id={selectId} {...register(selectId)}>
<option key="default" value="">
- Select -
<label className="usa-label" htmlFor={selectId}>
{label}
{required && <span className="required-indicator">*</span>}
</label>
<select className="usa-select" id={selectId} {...register(selectId)}>
<option key="default" value="">
- Select -
</option>
{options.map((option, index) => (
<option key={index} value={option.value}>
{option.label}
</option>
{options.map((option, index) => (
<option key={index} value={option.value}>
{option.label}
</option>
))}
</select>
{error && (
<span className="error-message" style={{ color: 'red' }}>
{error.message}
</span>
)}
</form>
))}
</select>
{error && (
<span className="error-message" style={{ color: 'red' }}>
{error.message}
</span>
)}
</div>
);
};
2 changes: 2 additions & 0 deletions packages/design/src/Form/components/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import RadioGroup from './RadioGroup/index.js';
import RichText from './RichText/index.js';
import Sequence from './Sequence/index.js';
import SelectDropdown from './SelectDropdown/index.js';
import DateOfBirth from './DateOfBirth/index.js';
import SubmissionConfirmation from './SubmissionConfirmation/index.js';
import TextInput from './TextInput/index.js';

Expand All @@ -28,6 +29,7 @@ export const defaultPatternComponents: ComponentForPattern = {
'radio-group': RadioGroup as PatternComponent,
'rich-text': RichText as PatternComponent,
'select-dropdown': SelectDropdown as PatternComponent,
'date-of-birth': DateOfBirth as PatternComponent,
sequence: Sequence as PatternComponent,
'submission-confirmation': SubmissionConfirmation as PatternComponent,
};
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ import classNames from 'classnames';
const icons: Record<string, string | any> = {
'block-icon.svg': blockIcon,
'checkbox-icon.svg': checkboxIcon,
'date-icon.svg.svg': dateIcon,
'date-icon.svg': dateIcon,
'dropdown-icon.svg': dropDownIcon,
'dropdownoption-icon.svg': dropDownOptionIcon,
'richtext-icon.svg': richTextIcon,
Expand Down Expand Up @@ -96,6 +96,7 @@ const sidebarPatterns: DropdownPattern[] = [
['radio-group', defaultFormConfig.patterns['radio-group']],
['package-download', defaultFormConfig.patterns['package-download']],
['select-dropdown', defaultFormConfig.patterns['select-dropdown']],
['date-of-birth', defaultFormConfig.patterns['date-of-birth']],
] as const;
export const fieldsetPatterns: DropdownPattern[] = [
['form-summary', defaultFormConfig.patterns['form-summary']],
Expand All @@ -106,6 +107,7 @@ export const fieldsetPatterns: DropdownPattern[] = [
['radio-group', defaultFormConfig.patterns['radio-group']],
['package-download', defaultFormConfig.patterns['package-download']],
['select-dropdown', defaultFormConfig.patterns['select-dropdown']],
['date-of-birth', defaultFormConfig.patterns['date-of-birth']],
] as const;

export const SidebarAddPatternMenuItem = ({
Expand Down
Loading

0 comments on commit a429f3c

Please sign in to comment.