hds-web 1.37.2 → 1.37.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/index.es.js +1 -1
  2. package/dist/index.js +1 -1
  3. package/package.json +1 -1
  4. package/src/HDS/components/Footers/v3Footer.js +1 -1
  5. package/src/HDS/modules/Cards/aboutSection.js +189 -121
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "hds-web",
3
- "version": "1.37.2",
3
+ "version": "1.37.3",
4
4
  "private": false,
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.es.js",
package/src/HDS/components/Footers/v3Footer.js CHANGED
@@ -367,7 +367,7 @@ V3Footer.defaultProps = {
367
367
  linkUrl: "https://hasura.io/help/",
368
368
  },
369
369
  {
370
- linkText: "Github",
370
+ linkText: "GitHub",
371
371
  linkUrl: "https://github.com/hasura",
372
372
  },
373
373
  {
package/src/HDS/modules/Cards/aboutSection.js CHANGED
@@ -1,15 +1,15 @@
1
1
  import React from "react";
2
- import { Badges } from '../../components/BadgesCaption'
2
+ import { Badges } from "../../components/BadgesCaption";
3
3
  import { Typography } from "../../foundation/Typography";
4
- import { HDSButton } from '../../components/Buttons';
4
+ import { HDSButton } from "../../components/Buttons";
5
5
  import { Icon } from "../../components/common-components";
6
6
  export default function AboutSection(props) {
7
- return (
8
- <>
9
- <div className="divide-y divide-neutral-200">
10
- <div className=" pb-8">
11
- <div>
12
- {/* <div className=" w-14 h-14 relative rounded-full border border-neutral-300 ">
7
+ return (
8
+ <>
9
+ <div className="divide-y divide-neutral-200">
10
+ <div className=" pb-8">
11
+ <div>
12
+ {/* <div className=" w-14 h-14 relative rounded-full border border-neutral-300 ">
13
13
  <img alt={props.title ?? 'connectorImage'} src={props.imgUrl} className="rounded-full w-full " />
14
14
  {props.is_verified && <div className="absolute top-8 left-10">
15
15
  <Icon
@@ -20,117 +20,185 @@ export default function AboutSection(props) {
20
20
  </div>
21
21
  }
22
22
  </div> */}
23
- {props.imgUrl && <div className="flex">
24
- <img alt={props.title ?? 'connectorImage'} src={props.imgUrl} className=" max-h-[25px] " />
25
- </div>}
23
+ {props.imgUrl && (
24
+ <div className="flex">
25
+ <img
26
+ alt={props.title ?? "connectorImage"}
27
+ src={props.imgUrl}
28
+ className=" max-h-[25px] "
29
+ />
30
+ </div>
31
+ )}
26
32
 
27
- {props.tags &&
28
- <div className="gap-2 pt-8 flex flex-wrap">
29
- {props.tags.map((tag, index) => (
30
- <Badges
31
- key={index}
32
- color={tag.color}
33
- children={tag.label}
34
- />
35
- ))}
36
- </div>
37
- }
38
- </div>
39
- <div>
40
- {props.title && <div className='pt-4 text-hds-t-h3 text-neutral-1000'>{props.title}</div>}
41
- {props.description && <Typography textStyle='sub2' className='pt-2 text-neutral-500'>{props.description}</Typography>}
42
- </div>
43
- {props.btnLink && <a href={props.btnLink} className='mt-4 flex' >
44
- <HDSButton
45
- type="secondary"
46
- label={props.btnLabel ?? 'Deployment guide'}
47
- state='default'
48
- size='sm'
49
- rightAnimatedArrow='true'
50
- rightAnimatedArrowColor='#3970FD'
51
- />
52
- </a>}
53
-
54
- </div>
55
- <div className="py-8 ">
56
- <Typography textStyle='h6' className='text-neutral-500 uppercase'>{props.aboutTitle ?? 'About'}</Typography>
57
- <div className="pt-4 flex flex-col gap-2">
58
- {props.versionValue && <div className="flex gap-2">
59
- <Typography textStyle='body1-medium' className='text-neutral-500'>{props.version ?? 'Version'}</Typography>
60
- <Badges
61
- color='blue'
62
- children={props.versionValue}
63
- // text_color='text-neutral-0'
64
- />
65
- </div>}
66
- {props.typeValue && <div className="flex gap-2 items-center">
67
- <Typography textStyle='body1-medium' className='text-neutral-500'>{props.typeText ?? 'Type'}</Typography>
68
- <Icon
69
- height={'h-5 w-5 stroke-[1.5px]'}
70
- variant={props.typeIconVariant}
71
- strokeClass='stroke-neutral-800'
72
- />
73
- <Typography textStyle='body1c-medium' className='text-neutral-800'>{props.typeValue}</Typography>
74
-
75
- </div>}
76
- {props.releasedValue && <div className="flex gap-2">
77
- <Typography textStyle='body1-medium' className='text-neutral-500'>{props.releasedText ?? 'Released'}</Typography>
78
- <Typography textStyle='body1-medium' className='text-neutral-800'>{props.releasedValue}</Typography>
79
- </div>}
80
- {props.lastUpdateValue && <div className="flex gap-2">
81
- <Typography textStyle='body1-medium' className='text-neutral-500'>{props.lastUpdatedText ?? 'Last Updated'}</Typography>
82
- <Typography textStyle='body1-medium' className='text-neutral-800'>{props.lastUpdateValue}</Typography>
83
- </div>}
84
- {props.deployed && <div className="flex gap-2">
85
- <Typography textStyle='body1-medium' className='text-neutral-500'>{props.deployed ?? 'Deployed'}</Typography>
86
- <Typography textStyle='body1-medium' className='text-neutral-800'>{props.deployedValue}</Typography>
87
- </div>}
88
- {props.githubRepoLink &&
89
- <a href={props.githubRepoLink} className="flex gap-2 items-center">
90
- <Icon
91
- height={'h-6 w-6 stroke-[1.5px]'}
92
- variant='octoface'
93
-
94
- />
95
- <Typography
96
- textStyle='body1-medium'
97
- className='text-blue-600'
98
- >
99
- {props.githubText ?? 'Github Repo'}
100
- </Typography>
101
- <Icon
102
- height={'h-5 w-5 stroke-[1.5px]'}
103
- variant='linkexternal01'
104
- strokeClass='stroke-blue-600'
105
- />
106
- </a>}
107
- </div>
108
-
109
- </div>
110
- <div className="py-8">
111
- <Typography textStyle='h6' className='text-neutral-500 uppercase'>{props.creator ?? 'Creator'}</Typography>
112
- {props.hasuraIncUrl && <a href={props.hasuraIncUrl} className="flex gap-2 items-center pt-4">
113
-
114
- <Typography
115
- textStyle='body1-medium'
116
- className='text-blue-600'
117
- >
118
- {props.hasuraInc ?? 'Hasura, Inc'}
119
- </Typography>
120
- <Icon
121
- height={'h-5 w-5 stroke-[1.5px]'}
122
- variant='linkexternal01'
123
- strokeClass='stroke-blue-600'
124
- />
125
- </a>}
126
- {props.Email && <Typography
127
- textStyle='body1-medium'
128
- className='text-neutral-500 pt-2'
129
- >
130
- {props.Email ?? 'support@hasura.io'}
131
- </Typography>}
132
- </div>
133
- </div>
134
- </>
135
- )
136
- }
33
+ {props.tags && (
34
+ <div className="gap-2 pt-8 flex flex-wrap">
35
+ {props.tags.map((tag, index) => (
36
+ <Badges key={index} color={tag.color} children={tag.label} />
37
+ ))}
38
+ </div>
39
+ )}
40
+ </div>
41
+ <div>
42
+ {props.title && (
43
+ <div className="pt-4 text-hds-t-h3 text-neutral-1000">
44
+ {props.title}
45
+ </div>
46
+ )}
47
+ {props.description && (
48
+ <Typography textStyle="sub2" className="pt-2 text-neutral-500">
49
+ {props.description}
50
+ </Typography>
51
+ )}
52
+ </div>
53
+ {props.btnLink && (
54
+ <a href={props.btnLink} className="mt-4 flex">
55
+ <HDSButton
56
+ type="secondary"
57
+ label={props.btnLabel ?? "Deployment guide"}
58
+ state="default"
59
+ size="sm"
60
+ rightAnimatedArrow="true"
61
+ rightAnimatedArrowColor="#3970FD"
62
+ />
63
+ </a>
64
+ )}
65
+ </div>
66
+ <div className="py-8 ">
67
+ <Typography textStyle="h6" className="text-neutral-500 uppercase">
68
+ {props.aboutTitle ?? "About"}
69
+ </Typography>
70
+ <div className="pt-4 flex flex-col gap-2">
71
+ {props.versionValue && (
72
+ <div className="flex gap-2">
73
+ <Typography
74
+ textStyle="body1-medium"
75
+ className="text-neutral-500"
76
+ >
77
+ {props.version ?? "Version"}
78
+ </Typography>
79
+ <Badges
80
+ color="blue"
81
+ children={props.versionValue}
82
+ // text_color='text-neutral-0'
83
+ />
84
+ </div>
85
+ )}
86
+ {props.typeValue && (
87
+ <div className="flex gap-2 items-center">
88
+ <Typography
89
+ textStyle="body1-medium"
90
+ className="text-neutral-500"
91
+ >
92
+ {props.typeText ?? "Type"}
93
+ </Typography>
94
+ <Icon
95
+ height={"h-5 w-5 stroke-[1.5px]"}
96
+ variant={props.typeIconVariant}
97
+ strokeClass="stroke-neutral-800"
98
+ />
99
+ <Typography
100
+ textStyle="body1c-medium"
101
+ className="text-neutral-800"
102
+ >
103
+ {props.typeValue}
104
+ </Typography>
105
+ </div>
106
+ )}
107
+ {props.releasedValue && (
108
+ <div className="flex gap-2">
109
+ <Typography
110
+ textStyle="body1-medium"
111
+ className="text-neutral-500"
112
+ >
113
+ {props.releasedText ?? "Released"}
114
+ </Typography>
115
+ <Typography
116
+ textStyle="body1-medium"
117
+ className="text-neutral-800"
118
+ >
119
+ {props.releasedValue}
120
+ </Typography>
121
+ </div>
122
+ )}
123
+ {props.lastUpdateValue && (
124
+ <div className="flex gap-2">
125
+ <Typography
126
+ textStyle="body1-medium"
127
+ className="text-neutral-500"
128
+ >
129
+ {props.lastUpdatedText ?? "Last Updated"}
130
+ </Typography>
131
+ <Typography
132
+ textStyle="body1-medium"
133
+ className="text-neutral-800"
134
+ >
135
+ {props.lastUpdateValue}
136
+ </Typography>
137
+ </div>
138
+ )}
139
+ {props.deployed && (
140
+ <div className="flex gap-2">
141
+ <Typography
142
+ textStyle="body1-medium"
143
+ className="text-neutral-500"
144
+ >
145
+ {props.deployed ?? "Deployed"}
146
+ </Typography>
147
+ <Typography
148
+ textStyle="body1-medium"
149
+ className="text-neutral-800"
150
+ >
151
+ {props.deployedValue}
152
+ </Typography>
153
+ </div>
154
+ )}
155
+ {props.githubRepoLink && (
156
+ <a
157
+ href={props.githubRepoLink}
158
+ className="flex gap-2 items-center"
159
+ >
160
+ <Icon height={"h-6 w-6 stroke-[1.5px]"} variant="octoface" />
161
+ <Typography textStyle="body1-medium" className="text-blue-600">
162
+ {props.githubText ?? "GitHub Repo"}
163
+ </Typography>
164
+ <Icon
165
+ height={"h-5 w-5 stroke-[1.5px]"}
166
+ variant="linkexternal01"
167
+ strokeClass="stroke-blue-600"
168
+ />
169
+ </a>
170
+ )}
171
+ </div>
172
+ </div>
173
+ <div className="py-8">
174
+ <Typography textStyle="h6" className="text-neutral-500 uppercase">
175
+ {props.creator ?? "Creator"}
176
+ </Typography>
177
+ {props.hasuraIncUrl && (
178
+ <a
179
+ href={props.hasuraIncUrl}
180
+ className="flex gap-2 items-center pt-4"
181
+ >
182
+ <Typography textStyle="body1-medium" className="text-blue-600">
183
+ {props.hasuraInc ?? "Hasura, Inc"}
184
+ </Typography>
185
+ <Icon
186
+ height={"h-5 w-5 stroke-[1.5px]"}
187
+ variant="linkexternal01"
188
+ strokeClass="stroke-blue-600"
189
+ />
190
+ </a>
191
+ )}
192
+ {props.Email && (
193
+ <Typography
194
+ textStyle="body1-medium"
195
+ className="text-neutral-500 pt-2"
196
+ >
197
+ {props.Email ?? "support@hasura.io"}
198
+ </Typography>
199
+ )}
200
+ </div>
201
+ </div>
202
+ </>
203
+ );
204
+ }