Skip to content

Commit e67f87e

Browse files
dlabajdlabaj
authored
feat(beta): Updated to the latest beta and merged updates from main. (#74)
* chore(pf-issue): Updated github actions to put issues in PatternFly Issues (#70) * feat(beta): Updated to the latest beta and added updates from main. * fix(beta): Removed cache file. * fix: Fixed padding issue and removed translate example. * fix: Added translation example back.
1 parent a3888d8 commit e67f87e

File tree

13 files changed

+26142
-1770
lines changed

13 files changed

+26142
-1770
lines changed

‎.github/workflows/extensions.yml

+1-1
Original file line numberDiff line numberDiff line change
@@ -12,5 +12,5 @@ jobs:
1212
steps:
1313
- uses: actions/[email protected]
1414
with:
15-
project-url: https://github.com/orgs/patternfly/projects/12
15+
project-url: https://github.com/orgs/patternfly/projects/7
1616
github-token: ${{ secrets.GH_PROJECTS }}

‎package-lock.json

+24,993
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

+2-1
Original file line numberDiff line numberDiff line change
@@ -59,5 +59,6 @@
5959
"jest-canvas-mock": "^2.4.0",
6060
"serve": "^14.1.2",
6161
"rimraf": "^2.6.2"
62-
}
62+
},
63+
"packageManager": "[email protected]+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e"
6364
}

‎packages/module/package.json

+6-6
Original file line numberDiff line numberDiff line change
@@ -33,8 +33,8 @@
3333
},
3434
"homepage": "https://github.com/patternfly/react-user-feedback#readme",
3535
"dependencies": {
36-
"@patternfly/react-core": "6.0.0-alpha.61",
37-
"@patternfly/react-icons": "6.0.0-alpha.23"
36+
"@patternfly/react-core": "6.0.0-alpha.94",
37+
"@patternfly/react-icons": "6.0.0-alpha.34"
3838
},
3939
"peerDependencies": {
4040
"react": "^17 || ^18",
@@ -50,10 +50,10 @@
5050
"@types/react": "^18",
5151
"@types/react-dom": "^18",
5252
"@patternfly/patternfly-a11y": "^4.3.1",
53-
"@patternfly/documentation-framework": "6.0.0-alpha.41",
54-
"@patternfly/patternfly":"6.0.0-alpha.139",
55-
"@patternfly/react-table": "6.0.0-alpha.61",
56-
"@patternfly/react-code-editor": "6.0.0-alpha.61",
53+
"@patternfly/documentation-framework": "6.0.0-alpha.69",
54+
"@patternfly/patternfly":"6.0.0-alpha.205",
55+
"@patternfly/react-table": "6.0.0-alpha.95",
56+
"@patternfly/react-code-editor": "6.0.0-alpha.94",
5757
"node-sass-package-importer": "^5.3.2",
5858
"fs-extra": "^9.1.0",
5959
"glob": "^7.2.3",

‎packages/module/patternfly-docs/generated/extensions/user-feedback/design-guidelines.js

+5-5
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,7 @@ const Component = () => (
4040
</strong>
4141
{` is a modal component that products can use to collect asynchronous feedback from users.`}
4242
</p>
43-
<AutoLinkHeader {...{"id":"elements","size":"h2","className":"ws-title ws-h2"}}>
43+
<AutoLinkHeader {...{"id":"elements","headingLevel":"h2","className":"ws-title ws-h2"}}>
4444
{`Elements`}
4545
</AutoLinkHeader>
4646
<p {...{"className":"pf-v6-c-content--p ws-p "}}>
@@ -76,7 +76,7 @@ const Component = () => (
7676
<p {...{"className":"pf-v6-c-content--p ws-p "}}>
7777
{`Each of these elements can be customized to fit a product's needs.`}
7878
</p>
79-
<AutoLinkHeader {...{"id":"behavior","size":"h2","className":"ws-title ws-h2"}}>
79+
<AutoLinkHeader {...{"id":"behavior","headingLevel":"h2","className":"ws-title ws-h2"}}>
8080
{`Behavior`}
8181
</AutoLinkHeader>
8282
<p {...{"className":"pf-v6-c-content--p ws-p "}}>
@@ -89,10 +89,10 @@ const Component = () => (
8989
<img src={srcImport1} width={srcImport1.width} height={srcImport1.height} {...{"alt":"Image of expanded dropdown menu with link to sharing feedback","className":"ws-img "}}>
9090
</img>
9191
</p>
92-
<AutoLinkHeader {...{"id":"variations","size":"h2","className":"ws-title ws-h2"}}>
92+
<AutoLinkHeader {...{"id":"variations","headingLevel":"h2","className":"ws-title ws-h2"}}>
9393
{`Variations`}
9494
</AutoLinkHeader>
95-
<AutoLinkHeader {...{"id":"modal-items-open-forms-within-the-modal","size":"h3","className":"ws-title ws-h3"}}>
95+
<AutoLinkHeader {...{"id":"modal-items-open-forms-within-the-modal","headingLevel":"h3","className":"ws-title ws-h3"}}>
9696
{`Modal items open forms within the modal`}
9797
</AutoLinkHeader>
9898
<p {...{"className":"pf-v6-c-content--p ws-p "}}>
@@ -139,7 +139,7 @@ const Component = () => (
139139
</p>
140140
</li>
141141
</ul>
142-
<AutoLinkHeader {...{"id":"modal-items-link-to-external-urls","size":"h3","className":"ws-title ws-h3"}}>
142+
<AutoLinkHeader {...{"id":"modal-items-link-to-external-urls","headingLevel":"h3","className":"ws-title ws-h3"}}>
143143
{`Modal items link to external URLs`}
144144
</AutoLinkHeader>
145145
<p {...{"className":"pf-v6-c-content--p ws-p "}}>

‎packages/module/patternfly-docs/generated/extensions/user-feedback/react.js

+3-22
Original file line numberDiff line numberDiff line change
@@ -76,8 +76,7 @@ const pageData = {
7676
"Basic modal",
7777
"Advanced modal",
7878
"Advanced that autofills an email address",
79-
"Modal with asynchronous call support",
80-
"Modal with internationalization support"
79+
"Modal with asynchronous call support"
8180
]
8281
};
8382
pageData.liveContext = {
@@ -140,42 +139,24 @@ pageData.examples = {
140139
</code>
141140
{` function to send data to a backend service.`}
142141
</p>
143-
</Example>,
144-
'Modal with internationalization support': props =>
145-
<Example {...pageData} {...props} {...{"code":"const i18nExample = {\n getSupport: 'Lorem ipsum dolor sit amet support',\n back: 'Lorem ipsum dolor sit amet back',\n bugReported: 'Lorem ipsum dolor sit amet Bug Reported',\n cancel: 'Cancel',\n close: 'Close',\n describeBug: \n 'Lorem ipsum dolor sit amet Describe the bug you encountered. For urgent issues, open a support case instead.',\n describeBugUrgentCases: \n 'Lorem ipsum dolor sit amet Describe the bug you encountered. For urgent issues, open a support case instead.',\n describeReportBug: \n 'Lorem ipsum dolor sit amet Describe the bug you encountered. Include where it is located and what action caused it. If this issue is urgent or blocking your workflow,',\n directInfluence:\n 'Lorem ipsum dolor sit amet your feedback will directly influence the future of Red Hat’s products. Opt in below to hear about future research opportunities via email.',\n email: 'Lorem ipsum dolor sit amet Email',\n enterFeedback: 'Lorem ipsum dolor sit amet Enter your feedback',\n feedback: 'Lorem ipsum dolor sit amet Feedback',\n feedbackSent: 'Lorem ipsum dolor sit amet Feedback Sent',\n helpUsImproveHCC: 'Lorem ipsum dolor sit amet Help us improve the Red Hat OpenShift.',\n howIsConsoleExperience: 'Lorem ipsum dolor sit amet What has your experience been like so far?',\n joinMailingList: 'Lorem ipsum dolor sit ametJoin mailing list',\n informDirectionDescription: \n 'Lorem ipsum dolor sit ametBy participating in feedback sessions, usability tests, and interviews with our',\n informDirection: 'Lorem ipsum dolor sit ametInform the direction of Red Hat',\n learnAboutResearchOpportunities: 'Lorem ipsum dolor sit ametLearn about opportunities to share your feedback with our User Research Team.',\n openSupportCase: 'Lorem ipsum dolor sit amet Support Case',\n problemProcessingRequest: \n 'Lorem ipsum dolor sit ametThere was a problem processing the request. Try reloading the page. If the problem persists, contact',\n support: 'Lorem ipsum dolor sit ametRed Hat support',\n reportABug: 'Lorem ipsum dolor sit ametReport a bug',\n responseSent: 'Lorem ipsum dolor sit ametResponse sent',\n researchOpportunities: 'Lorem ipsum dolor sit ametYes, I would like to hear about research opportunities',\n shareFeedback: 'Lorem ipsum dolor sit ametShare feedback',\n shareYourFeedback: 'Lorem ipsum dolor sit ametShare your feedback with us!',\n somethingWentWrong: 'Lorem ipsum dolor sit ametSomething went wrong',\n submitFeedback: 'Submit feedback',\n teamWillReviewBug: 'Lorem ipsum dolor sit ametWe appreciate your feedback and our team will review your report shortly',\n tellAboutExperience: 'Lorem ipsum dolor sit ametTell us about your experience',\n thankYouForFeedback: 'Lorem ipsum dolor sit ametThank you, we appreciate your feedback.',\n thankYouForInterest: \n 'Lorem ipsum dolor sit ametThank you for your interest in user research. You have been added to our mailing list.',\n userResearchTeam: 'Lorem ipsum dolor sit ametUser Research Team',\n weNeverSharePersonalInformation: \n 'Lorem ipsum dolor sit ametWe never share your personal information, and you can opt out at any time.',\n };\n\n\n /* eslint-disable no-debugger */\nimport React from 'react';\nimport { FeedbackModal} from '@patternfly/react-user-feedback';\nimport { Button } from '@patternfly/react-core';\n\nexport const AdvancedExample: React.FunctionComponent = () => {\n const [isOpen, setIsOpen] = React.useState<boolean>(false);\n const handleButtonClicked = () => {setIsOpen(true)}; \n return <>\n <Button onClick={handleButtonClicked}>Show Modal</Button>\n <FeedbackModal \n feedbackLocale={i18nExample}\n email= \"[email protected]\" \n onShareFeedback={()=>\n // Example of a successful callback\n true\n }\n onJoinMailingList={()=>\n true\n }\n onOpenSupportCase='https://pf-user-feedback-extension-form-demos.surge.sh/requestSupport.html'\n onReportABug={()=>true}\n isOpen={isOpen}\n onClose={()=>setIsOpen(false)}/>\n </>\n}","title":"Modal with internationalization support","lang":"js","className":""}}>
146-
147-
<p {...{"className":"pf-v6-c-content--p ws-p "}}>
148-
{`To customize the content displayed in the feedback modal, pass in a custom `}
149-
150-
<code {...{"className":"ws-code "}}>
151-
{`i18n`}
152-
</code>
153-
{` object with values for each property of`}
154-
155-
<code {...{"className":"ws-code "}}>
156-
{`<FeedbackModal>`}
157-
</code>
158-
{`. This allows you to prepare a modal for different languages and requirements.`}
159-
</p>
160142
</Example>
161143
};
162144

163145
const Component = () => (
164146
<React.Fragment>
165-
<AutoLinkHeader {...{"id":"about","size":"h2","className":"ws-title ws-h2"}}>
147+
<AutoLinkHeader {...{"id":"about","headingLevel":"h2","className":"ws-title ws-h2"}}>
166148
{`About`}
167149
</AutoLinkHeader>
168150
<p {...{"className":"pf-v6-c-content--p ws-p "}}>
169151
{`The user feedback extension is a PatternFly React based component used to collect user feedback. Examples of how to use this extension are documented below. This extensions allows users to submit feedback, report a bug, request support, as well as join a mailing list to stay updated on the latest news and research opportunities.`}
170152
</p>
171-
<AutoLinkHeader {...{"id":"examples","size":"h2","className":"ws-title ws-h2"}}>
153+
<AutoLinkHeader {...{"id":"examples","headingLevel":"h2","className":"ws-title ws-h2"}}>
172154
{`Examples`}
173155
</AutoLinkHeader>
174156
{React.createElement(pageData.examples["Basic modal"])}
175157
{React.createElement(pageData.examples["Advanced modal"])}
176158
{React.createElement(pageData.examples["Advanced that autofills an email address"])}
177159
{React.createElement(pageData.examples["Modal with asynchronous call support"])}
178-
{React.createElement(pageData.examples["Modal with internationalization support"])}
179160
</React.Fragment>
180161
);
181162
Component.displayName = 'ExtensionsUserFeedbackReactDocs';

‎packages/module/patternfly-docs/generated/index.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,8 @@ module.exports = {
22
'/extensions/user-feedback/react': {
33
id: "User feedback",
44
title: "User feedback",
5-
toc: [{"text":"About"},{"text":"Examples"},[{"text":"Basic modal"},{"text":"Advanced modal"},{"text":"Advanced that autofills an email address"},{"text":"Modal with asynchronous call support"},{"text":"Modal with internationalization support"}]],
6-
examples: ["Basic modal","Advanced modal","Advanced that autofills an email address","Modal with asynchronous call support","Modal with internationalization support"],
5+
toc: [{"text":"About"},{"text":"Examples"},[{"text":"Basic modal"},{"text":"Advanced modal"},{"text":"Advanced that autofills an email address"},{"text":"Modal with asynchronous call support"}]],
6+
examples: ["Basic modal","Advanced modal","Advanced that autofills an email address","Modal with asynchronous call support"],
77
section: "extensions",
88
subsection: "",
99
source: "react",

‎packages/module/src/Feedback/Feedback.scss

+3
Original file line numberDiff line numberDiff line change
@@ -78,6 +78,9 @@
7878
background-color: var(--pf-t--global--background--color--secondary--default);
7979
}
8080

81+
.chr-c-feedback-flex {
82+
margin-right: 0px;
83+
}
8184
.chr-c-feedback-text-area {
8285
resize: none;
8386
}

‎packages/module/src/Feedback/FeedbackError.tsx

+6-6
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React from 'react';
2-
import { Button, Text, TextContent, TextVariants } from '@patternfly/react-core';
2+
import { Button, Content, ContentVariants } from '@patternfly/react-core';
33
import ErrorIcon from '@patternfly/react-icons/dist/esm/icons/error-circle-o-icon';
44
import { LocaleContext } from '../context/LocaleContext';
55

@@ -14,15 +14,15 @@ const FeedbackError = ({ onCloseModal }: FeedbackErrorProps) => {
1414
return (
1515
<div className="chr-c-feedback-success-content">
1616
<ErrorIcon color="var(--pf-global--danger-color--100)" className="pf-u-mx-auto" />
17-
<TextContent>
18-
<Text component={TextVariants.h1}>{intl.somethingWentWrong}</Text>
19-
<Text>
17+
<>
18+
<Content component={ContentVariants.h1}>{intl.somethingWentWrong}</Content>
19+
<Content>
2020
{intl.problemProcessingRequest}{' '}
2121
<a target="_blank" href="https://access.redhat.com/support" rel="noreferrer">
2222
{intl.getSupport}
2323
</a>
24-
</Text>
25-
</TextContent>
24+
</Content>
25+
</>
2626
<Button variant="primary" onClick={onCloseModal}>
2727
{intl.close}
2828
</Button>

‎packages/module/src/Feedback/FeedbackForm.tsx

+5-6
Original file line numberDiff line numberDiff line change
@@ -8,11 +8,10 @@ import {
88
Checkbox,
99
Form,
1010
FormGroup,
11-
Text,
1211
TextArea,
13-
TextContent,
12+
Content,
1413
TextInput,
15-
TextVariants,
14+
ContentVariants,
1615
ValidatedOptions
1716
} from '@patternfly/react-core';
1817
import { LocaleContext } from '../context/LocaleContext';
@@ -88,10 +87,10 @@ export const FeedbackForm = ({
8887
};
8988
return (
9089
<div className="chr-c-feedback-content">
91-
<TextContent className="chr-c-feedback-heading">
92-
<Text component={TextVariants.h1}>{modalTitle}</Text>
90+
<div className="chr-c-feedback-heading">
91+
<Content component={ContentVariants.h1}>{modalTitle}</Content>
9392
{modalDescription}
94-
</TextContent>
93+
</div>
9594
<Form className="chr-c-feedback-content-main">
9695
{textAreaHidden ? (
9796
''

‎packages/module/src/Feedback/FeedbackModalInternal.tsx

+33-33
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,24 @@
11
import React, { memo, useState, useRef } from 'react';
22
import {
3-
Button,
4-
Card,
5-
CardBody,
6-
CardHeader,
7-
CardTitle,
8-
Flex,
9-
FlexItem,
10-
Modal,
11-
ModalVariant,
12-
Panel,
13-
PanelFooter,
14-
PanelHeader,
15-
PanelMain,
16-
PanelMainBody,
17-
Text,
18-
TextContent,
19-
TextVariants
3+
Button,
4+
Card,
5+
CardBody,
6+
CardHeader,
7+
CardTitle,
8+
Flex,
9+
FlexItem,
10+
Panel,
11+
PanelFooter,
12+
PanelHeader,
13+
PanelMain,
14+
PanelMainBody,
15+
Content,
16+
ContentVariants
2017
} from '@patternfly/react-core';
18+
import {
19+
Modal,
20+
ModalVariant
21+
} from '@patternfly/react-core/deprecated';
2122
import { ExternalLinkAltIcon } from '@patternfly/react-icons';
2223

2324
import feedbackImage from '../images/pf_feedback.svg';
@@ -82,14 +83,13 @@ export const FeedbackModalInternal = memo(
8283
return (
8384
<Panel isScrollable className="chr-c-feedback-content">
8485
<PanelHeader className="chr-c-feedback-heading">
85-
<TextContent>
8686
<FlexItem>
87-
<Text component={TextVariants.h1}>{intl.tellAboutExperience}</Text>
87+
<Content component={ContentVariants.h1}>{intl.tellAboutExperience}</Content>
8888
</FlexItem>
8989
<FlexItem>
90-
<Text>{intl.helpUsImproveHCC}</Text>
90+
<Content component="p">{intl.helpUsImproveHCC}</Content>
9191
</FlexItem>
92-
</TextContent>
92+
9393
</PanelHeader>
9494
<PanelMain tabIndex={0} className='chr-c-feedback-content-main'>
9595
<PanelMainBody className="chr-c-feedback-cards">
@@ -160,9 +160,9 @@ export const FeedbackModalInternal = memo(
160160
}}
161161
></CardHeader>
162162
<CardTitle>
163-
<Text>
163+
<Content component="p">
164164
{intl.openSupportCase} <ExternalLinkAltIcon />
165-
</Text>
165+
</Content>
166166
</CardTitle>
167167
<CardBody>{intl.getSupport}</CardBody>
168168
</Card>
@@ -187,10 +187,10 @@ export const FeedbackModalInternal = memo(
187187
}}
188188
></CardHeader>
189189
<CardTitle>
190-
<Text>
190+
<Content component="p">
191191
{intl.informDirection}{' '}
192192
{typeof onJoinMailingList === 'string' ? <ExternalLinkAltIcon /> : null}
193-
</Text>
193+
</Content>
194194
</CardTitle>
195195
<CardBody>{intl.learnAboutResearchOpportunities}</CardBody>
196196
</Card>
@@ -248,16 +248,16 @@ export const FeedbackModalInternal = memo(
248248
handleFeedbackError={() => setModalPage('feedbackError')}
249249
modalTitle={intl.reportABug}
250250
modalDescription={
251-
<Text>
251+
<Content component="p">
252252
{intl.describeReportBug}{' '}
253-
<Text
253+
<Content
254254
component="a"
255255
href="https://access.redhat.com/support/cases/#/case/new/open-case?caseCreate=true"
256256
target="_blank"
257257
>
258258
{intl.openSupportCase} <ExternalLinkAltIcon />
259-
</Text>
260-
</Text>
259+
</Content>
260+
</Content>
261261
}
262262
feedbackType="Bug"
263263
checkboxDescription={`${intl.learnAboutResearchOpportunities} ${intl.weNeverSharePersonalInformation}`}
@@ -281,13 +281,13 @@ export const FeedbackModalInternal = memo(
281281
handleFeedbackError={() => setModalPage('feedbackError')}
282282
modalTitle={intl.informDirection}
283283
modalDescription={
284-
<Text>
284+
<Content component="p">
285285
{intl.informDirectionDescription}
286-
<Text component="a" href="https://www.redhat.com/en/about/user-research" target="_blank">
286+
<Content component="a" href="https://www.redhat.com/en/about/user-research" target="_blank">
287287
{intl.userResearchTeam}
288-
</Text>
288+
</Content>
289289
{intl.directInfluence}
290-
</Text>
290+
</Content>
291291
}
292292
feedbackType="[Research Opportunities]"
293293
textAreaHidden={true}

‎packages/module/src/Feedback/FeedbackSuccess.tsx

+3-5
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React from 'react';
2-
import { Button, Text, TextContent, TextVariants } from '@patternfly/react-core';
2+
import { Button, Content, ContentVariants } from '@patternfly/react-core';
33
import CheckIcon from '@patternfly/react-icons/dist/js/icons/check-icon';
44

55
import './Feedback.scss';
@@ -16,10 +16,8 @@ const FeedbackSuccess = ({ onCloseModal, successTitle, successDescription }: Fee
1616
return (
1717
<div className="chr-c-feedback-success-content">
1818
<CheckIcon color="var(--pf-global--success-color--100)" className="pf-u-mx-auto" />
19-
<TextContent>
20-
<Text component={TextVariants.h1}>{successTitle}</Text>
21-
<Text>{successDescription}</Text>
22-
</TextContent>
19+
<Content component={ContentVariants.h1}>{successTitle}</Content>
20+
<Content>{successDescription}</Content>
2321
<Button variant="primary" onClick={onCloseModal}>
2422
{intl.close}
2523
</Button>

0 commit comments

Comments
 (0)