@fixefy/fixefy-ui-components 0.3.45 → 0.3.47

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.
@@ -1,4 +1,4 @@
1
- export declare const FxIcon: ({ icon, width, height, onClick, variant, fontSize, background, initials, path }: {
1
+ export declare const FxIcon: ({ icon, width, height, onClick, variant, fontSize, background, initials, }: {
2
2
  icon: string;
3
3
  width: number;
4
4
  height: number;
@@ -7,5 +7,4 @@ export declare const FxIcon: ({ icon, width, height, onClick, variant, fontSize,
7
7
  fontSize?: number;
8
8
  background?: string;
9
9
  initials?: string;
10
- path?: string;
11
10
  }) => JSX.Element;
@@ -59,7 +59,7 @@ function _interop_require_wildcard(obj, nodeInterop) {
59
59
  }
60
60
  return newObj;
61
61
  }
62
- const PublicIcon = ({ icon, width, height, onClick, variant, fontSize, background, initials, path })=>{
62
+ const PublicIcon = ({ icon, width, height, onClick, variant, fontSize, background, initials })=>{
63
63
  const [isError, setError] = (0, _react.useState)(false);
64
64
  const handleError = (isError)=>setError(isError);
65
65
  if (isError) {
@@ -81,27 +81,17 @@ const PublicIcon = ({ icon, width, height, onClick, variant, fontSize, backgroun
81
81
  alt: "",
82
82
  width: width,
83
83
  height: height,
84
- loader: ()=>{
85
- if (path) {
86
- return (0, _fixefyuiutils.imageLoader)({
87
- src: icon,
88
- //@ts-ignore
89
- path
90
- });
91
- } else {
92
- //@ts-ignore
93
- return (0, _fixefyuiutils.imageLoader)({
94
- src: icon
95
- });
96
- }
97
- },
84
+ loader: ()=>//@ts-ignore
85
+ (0, _fixefyuiutils.imageLoader)({
86
+ src: icon
87
+ }),
98
88
  src: icon,
99
89
  onLoad: ()=>handleError(false),
100
90
  onError: ()=>handleError(true),
101
91
  onClick: onClick
102
92
  });
103
93
  };
104
- const FxIcon = ({ icon, width, height, onClick, variant, fontSize, background, initials, path })=>{
94
+ const FxIcon = ({ icon, width, height, onClick, variant, fontSize, background, initials })=>{
105
95
  if (!icon) throw Error('Provide a property `icon`');
106
96
  return parseIconFromLibrary({
107
97
  icon,
@@ -111,11 +101,10 @@ const FxIcon = ({ icon, width, height, onClick, variant, fontSize, background, i
111
101
  variant,
112
102
  fontSize,
113
103
  background,
114
- initials,
115
- path
104
+ initials
116
105
  });
117
106
  };
118
- const parseIconFromLibrary = ({ icon, width, height, onClick, variant, fontSize, background, initials, path })=>{
107
+ const parseIconFromLibrary = ({ icon, width, height, onClick, variant, fontSize, background, initials })=>{
119
108
  return /*#__PURE__*/ (0, _jsxruntime.jsx)(PublicIcon, {
120
109
  icon: icon,
121
110
  width: width,
@@ -124,7 +113,6 @@ const parseIconFromLibrary = ({ icon, width, height, onClick, variant, fontSize,
124
113
  variant: variant,
125
114
  fontSize: fontSize,
126
115
  background: background,
127
- initials: initials,
128
- path: path
116
+ initials: initials
129
117
  });
130
118
  };
@@ -0,0 +1,6 @@
1
+ export declare const FxUserImage: ({ bucketAddress, user, loading, setLoading }: {
2
+ bucketAddress: string;
3
+ user: any;
4
+ loading: boolean;
5
+ setLoading: (loading: boolean) => void;
6
+ }) => any;
@@ -0,0 +1,231 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", {
3
+ value: true
4
+ });
5
+ Object.defineProperty(exports, "FxUserImage", {
6
+ enumerable: true,
7
+ get: function() {
8
+ return FxUserImage;
9
+ }
10
+ });
11
+ const _jsxruntime = require("react/jsx-runtime");
12
+ const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
13
+ const _image = /*#__PURE__*/ _interop_require_default(require("next/image"));
14
+ const _nookies = require("nookies");
15
+ const _FxIcon = require("../FxIcon");
16
+ const _nexts3upload = require("@fixefy/next-s3-upload");
17
+ const _fixefyuiutils = require("@fixefy/fixefy-ui-utils");
18
+ const _fixefyhooks = require("@fixefy/fixefy-hooks");
19
+ const _material = require("@mui/material");
20
+ function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
21
+ try {
22
+ var info = gen[key](arg);
23
+ var value = info.value;
24
+ } catch (error) {
25
+ reject(error);
26
+ return;
27
+ }
28
+ if (info.done) {
29
+ resolve(value);
30
+ } else {
31
+ Promise.resolve(value).then(_next, _throw);
32
+ }
33
+ }
34
+ function _async_to_generator(fn) {
35
+ return function() {
36
+ var self = this, args = arguments;
37
+ return new Promise(function(resolve, reject) {
38
+ var gen = fn.apply(self, args);
39
+ function _next(value) {
40
+ asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
41
+ }
42
+ function _throw(err) {
43
+ asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
44
+ }
45
+ _next(undefined);
46
+ });
47
+ };
48
+ }
49
+ function _interop_require_default(obj) {
50
+ return obj && obj.__esModule ? obj : {
51
+ default: obj
52
+ };
53
+ }
54
+ function _getRequireWildcardCache(nodeInterop) {
55
+ if (typeof WeakMap !== "function") return null;
56
+ var cacheBabelInterop = new WeakMap();
57
+ var cacheNodeInterop = new WeakMap();
58
+ return (_getRequireWildcardCache = function(nodeInterop) {
59
+ return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
60
+ })(nodeInterop);
61
+ }
62
+ function _interop_require_wildcard(obj, nodeInterop) {
63
+ if (!nodeInterop && obj && obj.__esModule) {
64
+ return obj;
65
+ }
66
+ if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
67
+ return {
68
+ default: obj
69
+ };
70
+ }
71
+ var cache = _getRequireWildcardCache(nodeInterop);
72
+ if (cache && cache.has(obj)) {
73
+ return cache.get(obj);
74
+ }
75
+ var newObj = {
76
+ __proto__: null
77
+ };
78
+ var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
79
+ for(var key in obj){
80
+ if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
81
+ var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
82
+ if (desc && (desc.get || desc.set)) {
83
+ Object.defineProperty(newObj, key, desc);
84
+ } else {
85
+ newObj[key] = obj[key];
86
+ }
87
+ }
88
+ }
89
+ newObj.default = obj;
90
+ if (cache) {
91
+ cache.set(obj, newObj);
92
+ }
93
+ return newObj;
94
+ }
95
+ const FxUserImage = ({ bucketAddress, user, loading, setLoading })=>{
96
+ const getRandomColor = (0, _fixefyhooks.useRandomColor)();
97
+ const { listS3Bucket } = (0, _nexts3upload.useS3ListBucket)();
98
+ const { downloadFromS3 } = (0, _nexts3upload.useS3Download)('download-bytearray');
99
+ const { email, full_name, first_name, last_name } = user;
100
+ var _ref;
101
+ // @ts-ignore
102
+ const initials = (0, _fixefyuiutils.toInitials)((_ref = full_name !== null && full_name !== void 0 ? full_name : first_name && last_name) !== null && _ref !== void 0 ? _ref : 'unknown').slice(0, 2);
103
+ const [file, setFile] = (0, _react.useState)(null);
104
+ const [files, setFiles] = (0, _react.useState)([]);
105
+ (0, _react.useEffect)(()=>{
106
+ fetchFiles();
107
+ }, []);
108
+ (0, _react.useEffect)(()=>{
109
+ if (file) {
110
+ setLoading(false);
111
+ }
112
+ }, [
113
+ file
114
+ ]);
115
+ (0, _react.useEffect)(()=>{
116
+ fetchFile(files);
117
+ }, []);
118
+ //// fetch single file from s3
119
+ const fetchFile = function() {
120
+ var _ref = _async_to_generator(function*(files) {
121
+ if (files.length) {
122
+ try {
123
+ var _files_, _files__Key, _files_1;
124
+ const data = yield downloadFromS3({
125
+ path: (_files_ = files[0]) === null || _files_ === void 0 ? void 0 : _files_.Key,
126
+ bucketName: `fixefy-${bucketAddress}`
127
+ });
128
+ const fileNames = (_files_1 = files[0]) === null || _files_1 === void 0 ? void 0 : (_files__Key = _files_1.Key) === null || _files__Key === void 0 ? void 0 : _files__Key.split('/').filter((part)=>part != '');
129
+ const fileName = fileNames[(fileNames === null || fileNames === void 0 ? void 0 : fileNames.length) - 1];
130
+ const fileType = fileName.split('.').pop();
131
+ const currentFile = {
132
+ data: data.content,
133
+ type: fileType,
134
+ name: fileName
135
+ };
136
+ setFile(currentFile);
137
+ setLoading(false);
138
+ } catch (err) {
139
+ console.error(err, err.stack, 'err');
140
+ setLoading(false);
141
+ }
142
+ setLoading(false);
143
+ }
144
+ });
145
+ return function fetchFile(files) {
146
+ return _ref.apply(this, arguments);
147
+ };
148
+ }();
149
+ /// fetch files from s3
150
+ const fetchFiles = function() {
151
+ var _ref = _async_to_generator(function*() {
152
+ setLoading(true);
153
+ const { ws, user } = (0, _nookies.parseCookies)();
154
+ let { workspaces } = JSON.parse(user);
155
+ if (typeof workspaces === 'string') {
156
+ workspaces = JSON.parse(workspaces);
157
+ }
158
+ const currentWorkspace = workspaces.find((workspace)=>(workspace === null || workspace === void 0 ? void 0 : workspace._id) === ws);
159
+ if (!currentWorkspace) {
160
+ console.log('Workspace not found.');
161
+ setLoading(false);
162
+ return;
163
+ }
164
+ const bucket = `fixefy-${bucketAddress}`;
165
+ const startAfter = `${currentWorkspace.readable_id}/${email}`;
166
+ const data = yield listS3Bucket({
167
+ bucketName: bucket,
168
+ prefix: startAfter,
169
+ startAfter
170
+ });
171
+ try {
172
+ if (data.contents.length) {
173
+ setFiles(data.contents);
174
+ fetchFile(data.contents);
175
+ } else {
176
+ setLoading(false);
177
+ }
178
+ } catch (err) {
179
+ console.error(err, err.stack, 'err');
180
+ }
181
+ });
182
+ return function fetchFiles() {
183
+ return _ref.apply(this, arguments);
184
+ };
185
+ }();
186
+ if (loading) return /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.CircularProgress, {
187
+ size: 24
188
+ });
189
+ if (!file && !loading) return /*#__PURE__*/ (0, _jsxruntime.jsx)(_FxIcon.FxIcon, {
190
+ icon: 'users',
191
+ width: 24,
192
+ height: 24,
193
+ variant: "rounded",
194
+ fontSize: 12,
195
+ initials: initials,
196
+ background: getRandomColor()
197
+ });
198
+ return file && !loading && /*#__PURE__*/ (0, _jsxruntime.jsx)(ImageView, {
199
+ data: file.data,
200
+ fileName: file.name,
201
+ type: file.type
202
+ });
203
+ };
204
+ const ImageView = ({ data, fileName, type })=>{
205
+ const [imageSrc, setImageSrc] = (0, _react.useState)(null);
206
+ (0, _react.useEffect)(()=>{
207
+ if (data instanceof Uint8Array) {
208
+ const blob = new Blob([
209
+ data
210
+ ], {
211
+ type: `image/${type == 'svg' ? 'svg+xml' : type}`
212
+ });
213
+ const url = URL.createObjectURL(blob);
214
+ setImageSrc(url);
215
+ return ()=>{
216
+ URL.revokeObjectURL(url);
217
+ };
218
+ } else {
219
+ setImageSrc(null);
220
+ return;
221
+ }
222
+ }, [
223
+ data
224
+ ]);
225
+ return imageSrc && /*#__PURE__*/ (0, _jsxruntime.jsx)(_image.default, {
226
+ width: 24,
227
+ height: 24,
228
+ src: imageSrc,
229
+ alt: fileName
230
+ });
231
+ };
@@ -0,0 +1 @@
1
+ export { FxUserImage } from './FxUserImage';
@@ -0,0 +1,11 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", {
3
+ value: true
4
+ });
5
+ Object.defineProperty(exports, "FxUserImage", {
6
+ enumerable: true,
7
+ get: function() {
8
+ return _FxUserImage.FxUserImage;
9
+ }
10
+ });
11
+ const _FxUserImage = require("./FxUserImage");
package/package.json CHANGED
@@ -5,8 +5,9 @@
5
5
  },
6
6
  "dependencies": {
7
7
  "@apollo/client": "3.10.4",
8
- "@fixefy/fixefy-hooks": "0.0.10",
9
- "@fixefy/fixefy-ui-utils": "0.2.53",
8
+ "@fixefy/fixefy-hooks": "0.0.11",
9
+ "@fixefy/fixefy-ui-utils": "0.2.54",
10
+ "@fixefy/next-s3-upload": "^0.0.12",
10
11
  "@mui/icons-material": "5.16.7",
11
12
  "@mui/lab": "6.0.0-beta.7",
12
13
  "@mui/material": "5.16.7",
@@ -68,5 +69,5 @@
68
69
  "require": "./dist/index.js"
69
70
  }
70
71
  },
71
- "version": "0.3.45"
72
+ "version": "0.3.47"
72
73
  }