@magmamath/students-features 0.6.6-rc.7 → 0.6.6-rc.8
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.
- package/dist/commonjs/features/gifCelebrations/components/Gif.js +9 -27
- package/dist/commonjs/features/gifCelebrations/components/Gif.js.map +1 -1
- package/dist/commonjs/features/gifCelebrations/helpers.js +16 -1
- package/dist/commonjs/features/gifCelebrations/helpers.js.map +1 -1
- package/dist/module/features/gifCelebrations/components/Gif.js +10 -28
- package/dist/module/features/gifCelebrations/components/Gif.js.map +1 -1
- package/dist/module/features/gifCelebrations/helpers.js +13 -0
- package/dist/module/features/gifCelebrations/helpers.js.map +1 -1
- package/dist/typescript/commonjs/features/gifCelebrations/components/Gif.d.ts.map +1 -1
- package/dist/typescript/commonjs/features/gifCelebrations/helpers.d.ts +3 -1
- package/dist/typescript/commonjs/features/gifCelebrations/helpers.d.ts.map +1 -1
- package/dist/typescript/module/features/gifCelebrations/components/Gif.d.ts.map +1 -1
- package/dist/typescript/module/features/gifCelebrations/helpers.d.ts +3 -1
- package/dist/typescript/module/features/gifCelebrations/helpers.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/features/gifCelebrations/components/Gif.tsx +11 -31
- package/src/features/gifCelebrations/helpers.ts +18 -0
|
@@ -16,12 +16,6 @@ var _jsxRuntime = require("react/jsx-runtime");
|
|
|
16
16
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
17
17
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
|
18
18
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
19
|
-
// IS_WEB
|
|
20
|
-
// ? {
|
|
21
|
-
// uri: confettiImage,
|
|
22
|
-
// }
|
|
23
|
-
// : require('../assets/confetti.webp')
|
|
24
|
-
|
|
25
19
|
const Gif = ({
|
|
26
20
|
gifObject,
|
|
27
21
|
getCachePathMethod,
|
|
@@ -34,33 +28,21 @@ const Gif = ({
|
|
|
34
28
|
const gifLabel = (0, _helpers.getGifLabel)(gifGroupNumber);
|
|
35
29
|
(0, _react.useLayoutEffect)(() => {
|
|
36
30
|
const loadImageSize = async () => {
|
|
37
|
-
let localPath
|
|
38
|
-
/**
|
|
39
|
-
* Image.queryCache works only for WEB, so we need to use a custom method (Expo Image) for React Native
|
|
40
|
-
*/
|
|
31
|
+
let localPath;
|
|
41
32
|
try {
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
//@ts-ignore
|
|
45
|
-
localPath = await getCachePathMethod(gifObject.url);
|
|
46
|
-
} else {
|
|
47
|
-
//@ts-ignore
|
|
48
|
-
localPath = await _reactNative.Image.queryCache([gifObject.url]).then(result => result[gifObject.url]);
|
|
49
|
-
}
|
|
50
|
-
if (!localPath) {
|
|
51
|
-
throw new Error('Image not found in cache');
|
|
52
|
-
}
|
|
33
|
+
// Get image path based on platform (React Native or Web)
|
|
34
|
+
localPath = await (0, _helpers.getImagePath)(gifObject.url, getCachePathMethod);
|
|
53
35
|
} catch (error) {
|
|
54
|
-
|
|
55
|
-
localPath = _constants2.IS_WEB ? _gifFallback.default :
|
|
36
|
+
// Use fallback if image not found in cache
|
|
37
|
+
localPath = _constants2.IS_WEB ? _gifFallback.default : _reactNative.Image.resolveAssetSource(_gifFallback.default).uri;
|
|
56
38
|
}
|
|
57
|
-
|
|
39
|
+
|
|
40
|
+
// Get and set image dimensions
|
|
58
41
|
_reactNative.Image.getSize(localPath, (width, height) => {
|
|
59
42
|
setSize({
|
|
60
|
-
width:
|
|
61
|
-
height:
|
|
43
|
+
width: (0, _helpers.constrainDimension)(width, _constants.MIN_GIF_SIZE, _constants.MAX_GIF_SIZE.WIDTH),
|
|
44
|
+
height: (0, _helpers.constrainDimension)(height, _constants.MIN_GIF_SIZE, _constants.MAX_GIF_SIZE.HEIGHT)
|
|
62
45
|
});
|
|
63
|
-
//@ts-ignore
|
|
64
46
|
setPathOrUri(localPath);
|
|
65
47
|
});
|
|
66
48
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_reactNative","require","_react","_interopRequireWildcard","_reactNativeUi","_constants","_index","_helpers","_gifFallback","_interopRequireDefault","_constants2","_jsxRuntime","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","Gif","gifObject","getCachePathMethod","TextComponent","size","setSize","useState","pathOrUri","setPathOrUri","useText","gifGroupNumber","Number","group","replace","gifLabel","getGifLabel","useLayoutEffect","loadImageSize","localPath","
|
|
1
|
+
{"version":3,"names":["_reactNative","require","_react","_interopRequireWildcard","_reactNativeUi","_constants","_index","_helpers","_gifFallback","_interopRequireDefault","_constants2","_jsxRuntime","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","Gif","gifObject","getCachePathMethod","TextComponent","size","setSize","useState","pathOrUri","setPathOrUri","useText","gifGroupNumber","Number","group","replace","gifLabel","getGifLabel","useLayoutEffect","loadImageSize","localPath","getImagePath","url","error","IS_WEB","gifFallback","Image","resolveAssetSource","uri","getSize","width","height","constrainDimension","MIN_GIF_SIZE","MAX_GIF_SIZE","WIDTH","HEIGHT","jsx","View","style","styles","backgroundContainer","children","jsxs","container","alt","source","image","textContainer","exports","StyleSheet","create","backgroundColor","borderRadius","padding","SPACING","BORDER_RADIUS","COLORS","NEUTRAL_1","position","bottom","alignSelf"],"sourceRoot":"../../../../../src","sources":["features/gifCelebrations/components/Gif.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.getProgressLineWidth = exports.getGifLabel = exports.generateGifsStructure = exports.findGroupForPercentage = exports.calculatePercentageTable = void 0;
|
|
6
|
+
exports.getProgressLineWidth = exports.getImagePath = exports.getGifLabel = exports.generateGifsStructure = exports.findGroupForPercentage = exports.constrainDimension = exports.calculatePercentageTable = void 0;
|
|
7
7
|
var _constants = require("./constants.js");
|
|
8
8
|
/**
|
|
9
9
|
* Number of problems When we show gif
|
|
@@ -93,4 +93,19 @@ const findGroupForPercentage = percentage => {
|
|
|
93
93
|
return 'group3';
|
|
94
94
|
};
|
|
95
95
|
exports.findGroupForPercentage = findGroupForPercentage;
|
|
96
|
+
const getImagePath = async (url, cacheMethod) => {
|
|
97
|
+
if (cacheMethod) {
|
|
98
|
+
const path = await cacheMethod(url);
|
|
99
|
+
if (path) return path;
|
|
100
|
+
} else {
|
|
101
|
+
// @ts-ignore - Image.queryCache works only in web
|
|
102
|
+
const cachedImage = await Image.queryCache([url]);
|
|
103
|
+
const path = cachedImage[url];
|
|
104
|
+
if (path) return path;
|
|
105
|
+
}
|
|
106
|
+
throw new Error('Image not found in cache');
|
|
107
|
+
};
|
|
108
|
+
exports.getImagePath = getImagePath;
|
|
109
|
+
const constrainDimension = (value, min, max) => Math.max(min, Math.min(max, value));
|
|
110
|
+
exports.constrainDimension = constrainDimension;
|
|
96
111
|
//# sourceMappingURL=helpers.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_constants","require","calculatePercentageTable","totalProblems","Math","ceil","exports","generateGifsStructure","gifs","Object","fromEntries","entries","map","key","value","url","isShown","group","getGifLabel","relatedGroup","getProgressLineWidth","completedPercent","MIN_WIDTH_FOR_ONE_DIGIT","MIN_WIDTH_FOR_TWO_DIGITS","findGroupForPercentage","percentage"],"sourceRoot":"../../../../src","sources":["features/gifCelebrations/helpers.ts"],"mappings":";;;;;;
|
|
1
|
+
{"version":3,"names":["_constants","require","calculatePercentageTable","totalProblems","Math","ceil","exports","generateGifsStructure","gifs","Object","fromEntries","entries","map","key","value","url","isShown","group","getGifLabel","relatedGroup","getProgressLineWidth","completedPercent","MIN_WIDTH_FOR_ONE_DIGIT","MIN_WIDTH_FOR_TWO_DIGITS","findGroupForPercentage","percentage","getImagePath","cacheMethod","path","cachedImage","Image","queryCache","Error","constrainDimension","min","max"],"sourceRoot":"../../../../src","sources":["features/gifCelebrations/helpers.ts"],"mappings":"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","ignoreList":[]}
|
|
@@ -5,16 +5,10 @@ import React, { useLayoutEffect, useState } from 'react';
|
|
|
5
5
|
import { BORDER_RADIUS, COLORS, SPACING } from '@magmamath/react-native-ui';
|
|
6
6
|
import { MAX_GIF_SIZE, MIN_GIF_SIZE } from "../constants.js";
|
|
7
7
|
import { useText } from "../../../shared/translation/index.js";
|
|
8
|
-
import { getGifLabel } from "../helpers.js";
|
|
8
|
+
import { constrainDimension, getGifLabel, getImagePath } from "../helpers.js";
|
|
9
9
|
import gifFallback from '../assets/gifFallback.gif';
|
|
10
10
|
import { IS_WEB } from "../../../shared/constants.js";
|
|
11
11
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
12
|
-
// IS_WEB
|
|
13
|
-
// ? {
|
|
14
|
-
// uri: confettiImage,
|
|
15
|
-
// }
|
|
16
|
-
// : require('../assets/confetti.webp')
|
|
17
|
-
|
|
18
12
|
export const Gif = ({
|
|
19
13
|
gifObject,
|
|
20
14
|
getCachePathMethod,
|
|
@@ -27,33 +21,21 @@ export const Gif = ({
|
|
|
27
21
|
const gifLabel = getGifLabel(gifGroupNumber);
|
|
28
22
|
useLayoutEffect(() => {
|
|
29
23
|
const loadImageSize = async () => {
|
|
30
|
-
let localPath
|
|
31
|
-
/**
|
|
32
|
-
* Image.queryCache works only for WEB, so we need to use a custom method (Expo Image) for React Native
|
|
33
|
-
*/
|
|
24
|
+
let localPath;
|
|
34
25
|
try {
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
//@ts-ignore
|
|
38
|
-
localPath = await getCachePathMethod(gifObject.url);
|
|
39
|
-
} else {
|
|
40
|
-
//@ts-ignore
|
|
41
|
-
localPath = await Image.queryCache([gifObject.url]).then(result => result[gifObject.url]);
|
|
42
|
-
}
|
|
43
|
-
if (!localPath) {
|
|
44
|
-
throw new Error('Image not found in cache');
|
|
45
|
-
}
|
|
26
|
+
// Get image path based on platform (React Native or Web)
|
|
27
|
+
localPath = await getImagePath(gifObject.url, getCachePathMethod);
|
|
46
28
|
} catch (error) {
|
|
47
|
-
|
|
48
|
-
localPath = IS_WEB ? gifFallback :
|
|
29
|
+
// Use fallback if image not found in cache
|
|
30
|
+
localPath = IS_WEB ? gifFallback : Image.resolveAssetSource(gifFallback).uri;
|
|
49
31
|
}
|
|
50
|
-
|
|
32
|
+
|
|
33
|
+
// Get and set image dimensions
|
|
51
34
|
Image.getSize(localPath, (width, height) => {
|
|
52
35
|
setSize({
|
|
53
|
-
width:
|
|
54
|
-
height:
|
|
36
|
+
width: constrainDimension(width, MIN_GIF_SIZE, MAX_GIF_SIZE.WIDTH),
|
|
37
|
+
height: constrainDimension(height, MIN_GIF_SIZE, MAX_GIF_SIZE.HEIGHT)
|
|
55
38
|
});
|
|
56
|
-
//@ts-ignore
|
|
57
39
|
setPathOrUri(localPath);
|
|
58
40
|
});
|
|
59
41
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["StyleSheet","View","Image","React","useLayoutEffect","useState","BORDER_RADIUS","COLORS","SPACING","MAX_GIF_SIZE","MIN_GIF_SIZE","useText","getGifLabel","gifFallback","IS_WEB","jsx","_jsx","jsxs","_jsxs","Gif","gifObject","getCachePathMethod","TextComponent","size","setSize","pathOrUri","setPathOrUri","t","gifGroupNumber","Number","group","replace","gifLabel","loadImageSize","localPath","
|
|
1
|
+
{"version":3,"names":["StyleSheet","View","Image","React","useLayoutEffect","useState","BORDER_RADIUS","COLORS","SPACING","MAX_GIF_SIZE","MIN_GIF_SIZE","useText","constrainDimension","getGifLabel","getImagePath","gifFallback","IS_WEB","jsx","_jsx","jsxs","_jsxs","Gif","gifObject","getCachePathMethod","TextComponent","size","setSize","pathOrUri","setPathOrUri","t","gifGroupNumber","Number","group","replace","gifLabel","loadImageSize","localPath","url","error","resolveAssetSource","uri","getSize","width","height","WIDTH","HEIGHT","style","styles","backgroundContainer","children","container","alt","source","image","textContainer","create","backgroundColor","borderRadius","padding","NEUTRAL_1","position","bottom","alignSelf"],"sourceRoot":"../../../../../src","sources":["features/gifCelebrations/components/Gif.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -85,4 +85,17 @@ export const findGroupForPercentage = percentage => {
|
|
|
85
85
|
}
|
|
86
86
|
return 'group3';
|
|
87
87
|
};
|
|
88
|
+
export const getImagePath = async (url, cacheMethod) => {
|
|
89
|
+
if (cacheMethod) {
|
|
90
|
+
const path = await cacheMethod(url);
|
|
91
|
+
if (path) return path;
|
|
92
|
+
} else {
|
|
93
|
+
// @ts-ignore - Image.queryCache works only in web
|
|
94
|
+
const cachedImage = await Image.queryCache([url]);
|
|
95
|
+
const path = cachedImage[url];
|
|
96
|
+
if (path) return path;
|
|
97
|
+
}
|
|
98
|
+
throw new Error('Image not found in cache');
|
|
99
|
+
};
|
|
100
|
+
export const constrainDimension = (value, min, max) => Math.max(min, Math.min(max, value));
|
|
88
101
|
//# sourceMappingURL=helpers.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["MIN_WIDTH_FOR_ONE_DIGIT","MIN_WIDTH_FOR_TWO_DIGITS","calculatePercentageTable","totalProblems","Math","ceil","generateGifsStructure","gifs","Object","fromEntries","entries","map","key","value","url","isShown","group","getGifLabel","relatedGroup","getProgressLineWidth","completedPercent","findGroupForPercentage","percentage"],"sourceRoot":"../../../../src","sources":["features/gifCelebrations/helpers.ts"],"mappings":";;
|
|
1
|
+
{"version":3,"names":["MIN_WIDTH_FOR_ONE_DIGIT","MIN_WIDTH_FOR_TWO_DIGITS","calculatePercentageTable","totalProblems","Math","ceil","generateGifsStructure","gifs","Object","fromEntries","entries","map","key","value","url","isShown","group","getGifLabel","relatedGroup","getProgressLineWidth","completedPercent","findGroupForPercentage","percentage","getImagePath","cacheMethod","path","cachedImage","Image","queryCache","Error","constrainDimension","min","max"],"sourceRoot":"../../../../src","sources":["features/gifCelebrations/helpers.ts"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Gif.d.ts","sourceRoot":"","sources":["../../../../../../src/features/gifCelebrations/components/Gif.tsx"],"names":[],"mappings":"AACA,OAAO,KAAoC,MAAM,OAAO,CAAA;AAExD,OAAO,EAAE,wBAAwB,EAAE,SAAS,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAA;AAO7F,KAAK,QAAQ,GAAG;IACd,SAAS,EAAE,SAAS,CAAA;IACpB,kBAAkB,CAAC,EAAE,wBAAwB,CAAA;IAC7C,aAAa,EAAE,iBAAiB,CAAA;CACjC,CAAA;
|
|
1
|
+
{"version":3,"file":"Gif.d.ts","sourceRoot":"","sources":["../../../../../../src/features/gifCelebrations/components/Gif.tsx"],"names":[],"mappings":"AACA,OAAO,KAAoC,MAAM,OAAO,CAAA;AAExD,OAAO,EAAE,wBAAwB,EAAE,SAAS,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAA;AAO7F,KAAK,QAAQ,GAAG;IACd,SAAS,EAAE,SAAS,CAAA;IACpB,kBAAkB,CAAC,EAAE,wBAAwB,CAAA;IAC7C,aAAa,EAAE,iBAAiB,CAAA;CACjC,CAAA;AAOD,eAAO,MAAM,GAAG,qDAAsD,QAAQ,sBAoD7E,CAAA"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { TranslationKeys } from 'src/shared/translation/types';
|
|
2
|
-
import { GifsGroups, GifsStructure, GroupNumber, ProblemsPercentageTable } from './types/model.types';
|
|
2
|
+
import { CustomGetCachePathMethod, GifsGroups, GifsStructure, GroupNumber, ProblemsPercentageTable } from './types/model.types';
|
|
3
3
|
/**
|
|
4
4
|
* Number of problems When we show gif
|
|
5
5
|
* <6 Never
|
|
@@ -23,4 +23,6 @@ export declare const generateGifsStructure: (gifs: GifsGroups) => GifsStructure;
|
|
|
23
23
|
export declare const getGifLabel: (relatedGroup: GroupNumber) => TranslationKeys;
|
|
24
24
|
export declare const getProgressLineWidth: (completedPercent: number) => number;
|
|
25
25
|
export declare const findGroupForPercentage: (percentage: number) => "group1" | "group2" | "group3";
|
|
26
|
+
export declare const getImagePath: (url: string, cacheMethod?: CustomGetCachePathMethod) => Promise<any>;
|
|
27
|
+
export declare const constrainDimension: (value: number, min: number, max: number) => number;
|
|
26
28
|
//# sourceMappingURL=helpers.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../../../src/features/gifCelebrations/helpers.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAA;AAC9D,OAAO,EACL,UAAU,EACV,aAAa,EACb,WAAW,EACX,uBAAuB,EACxB,MAAM,qBAAqB,CAAA;AAG5B;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,wBAAwB,kBAAmB,MAAM,KAAG,uBAkChE,CAAA;AAED,eAAO,MAAM,qBAAqB,SAAU,UAAU,KAAG,aAUtD,CAAA;AAEH,eAAO,MAAM,WAAW,iBAAkB,WAAW,KAAG,eASvD,CAAA;AAED,eAAO,MAAM,oBAAoB,qBAAsB,MAAM,WAQ5D,CAAA;AAED,eAAO,MAAM,sBAAsB,eAAgB,MAAM,mCAQxD,CAAA"}
|
|
1
|
+
{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../../../src/features/gifCelebrations/helpers.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAA;AAC9D,OAAO,EACL,wBAAwB,EACxB,UAAU,EACV,aAAa,EACb,WAAW,EACX,uBAAuB,EACxB,MAAM,qBAAqB,CAAA;AAG5B;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,wBAAwB,kBAAmB,MAAM,KAAG,uBAkChE,CAAA;AAED,eAAO,MAAM,qBAAqB,SAAU,UAAU,KAAG,aAUtD,CAAA;AAEH,eAAO,MAAM,WAAW,iBAAkB,WAAW,KAAG,eASvD,CAAA;AAED,eAAO,MAAM,oBAAoB,qBAAsB,MAAM,WAQ5D,CAAA;AAED,eAAO,MAAM,sBAAsB,eAAgB,MAAM,mCAQxD,CAAA;AAED,eAAO,MAAM,YAAY,QAAe,MAAM,gBAAgB,wBAAwB,iBAYrF,CAAA;AAED,eAAO,MAAM,kBAAkB,UAAW,MAAM,OAAO,MAAM,OAAO,MAAM,WACrC,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Gif.d.ts","sourceRoot":"","sources":["../../../../../../src/features/gifCelebrations/components/Gif.tsx"],"names":[],"mappings":"AACA,OAAO,KAAoC,MAAM,OAAO,CAAA;AAExD,OAAO,EAAE,wBAAwB,EAAE,SAAS,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAA;AAO7F,KAAK,QAAQ,GAAG;IACd,SAAS,EAAE,SAAS,CAAA;IACpB,kBAAkB,CAAC,EAAE,wBAAwB,CAAA;IAC7C,aAAa,EAAE,iBAAiB,CAAA;CACjC,CAAA;
|
|
1
|
+
{"version":3,"file":"Gif.d.ts","sourceRoot":"","sources":["../../../../../../src/features/gifCelebrations/components/Gif.tsx"],"names":[],"mappings":"AACA,OAAO,KAAoC,MAAM,OAAO,CAAA;AAExD,OAAO,EAAE,wBAAwB,EAAE,SAAS,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAA;AAO7F,KAAK,QAAQ,GAAG;IACd,SAAS,EAAE,SAAS,CAAA;IACpB,kBAAkB,CAAC,EAAE,wBAAwB,CAAA;IAC7C,aAAa,EAAE,iBAAiB,CAAA;CACjC,CAAA;AAOD,eAAO,MAAM,GAAG,qDAAsD,QAAQ,sBAoD7E,CAAA"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { TranslationKeys } from 'src/shared/translation/types';
|
|
2
|
-
import { GifsGroups, GifsStructure, GroupNumber, ProblemsPercentageTable } from './types/model.types';
|
|
2
|
+
import { CustomGetCachePathMethod, GifsGroups, GifsStructure, GroupNumber, ProblemsPercentageTable } from './types/model.types';
|
|
3
3
|
/**
|
|
4
4
|
* Number of problems When we show gif
|
|
5
5
|
* <6 Never
|
|
@@ -23,4 +23,6 @@ export declare const generateGifsStructure: (gifs: GifsGroups) => GifsStructure;
|
|
|
23
23
|
export declare const getGifLabel: (relatedGroup: GroupNumber) => TranslationKeys;
|
|
24
24
|
export declare const getProgressLineWidth: (completedPercent: number) => number;
|
|
25
25
|
export declare const findGroupForPercentage: (percentage: number) => "group1" | "group2" | "group3";
|
|
26
|
+
export declare const getImagePath: (url: string, cacheMethod?: CustomGetCachePathMethod) => Promise<any>;
|
|
27
|
+
export declare const constrainDimension: (value: number, min: number, max: number) => number;
|
|
26
28
|
//# sourceMappingURL=helpers.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../../../src/features/gifCelebrations/helpers.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAA;AAC9D,OAAO,EACL,UAAU,EACV,aAAa,EACb,WAAW,EACX,uBAAuB,EACxB,MAAM,qBAAqB,CAAA;AAG5B;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,wBAAwB,kBAAmB,MAAM,KAAG,uBAkChE,CAAA;AAED,eAAO,MAAM,qBAAqB,SAAU,UAAU,KAAG,aAUtD,CAAA;AAEH,eAAO,MAAM,WAAW,iBAAkB,WAAW,KAAG,eASvD,CAAA;AAED,eAAO,MAAM,oBAAoB,qBAAsB,MAAM,WAQ5D,CAAA;AAED,eAAO,MAAM,sBAAsB,eAAgB,MAAM,mCAQxD,CAAA"}
|
|
1
|
+
{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../../../src/features/gifCelebrations/helpers.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAA;AAC9D,OAAO,EACL,wBAAwB,EACxB,UAAU,EACV,aAAa,EACb,WAAW,EACX,uBAAuB,EACxB,MAAM,qBAAqB,CAAA;AAG5B;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,wBAAwB,kBAAmB,MAAM,KAAG,uBAkChE,CAAA;AAED,eAAO,MAAM,qBAAqB,SAAU,UAAU,KAAG,aAUtD,CAAA;AAEH,eAAO,MAAM,WAAW,iBAAkB,WAAW,KAAG,eASvD,CAAA;AAED,eAAO,MAAM,oBAAoB,qBAAsB,MAAM,WAQ5D,CAAA;AAED,eAAO,MAAM,sBAAsB,eAAgB,MAAM,mCAQxD,CAAA;AAED,eAAO,MAAM,YAAY,QAAe,MAAM,gBAAgB,wBAAwB,iBAYrF,CAAA;AAED,eAAO,MAAM,kBAAkB,UAAW,MAAM,OAAO,MAAM,OAAO,MAAM,WACrC,CAAA"}
|
package/package.json
CHANGED
|
@@ -4,7 +4,7 @@ import { BORDER_RADIUS, COLORS, SPACING } from '@magmamath/react-native-ui'
|
|
|
4
4
|
import { CustomGetCachePathMethod, GifObject, TextComponentType } from '../types/model.types'
|
|
5
5
|
import { MAX_GIF_SIZE, MIN_GIF_SIZE } from '../constants'
|
|
6
6
|
import { useText } from '../../../shared/translation'
|
|
7
|
-
import { getGifLabel } from '../helpers'
|
|
7
|
+
import { constrainDimension, getGifLabel, getImagePath } from '../helpers'
|
|
8
8
|
import gifFallback from '../assets/gifFallback.gif'
|
|
9
9
|
import { IS_WEB } from '../../../shared/constants'
|
|
10
10
|
|
|
@@ -19,12 +19,6 @@ type Size = {
|
|
|
19
19
|
height: number
|
|
20
20
|
}
|
|
21
21
|
|
|
22
|
-
// IS_WEB
|
|
23
|
-
// ? {
|
|
24
|
-
// uri: confettiImage,
|
|
25
|
-
// }
|
|
26
|
-
// : require('../assets/confetti.webp')
|
|
27
|
-
|
|
28
22
|
export const Gif = ({ gifObject, getCachePathMethod, TextComponent }: GifProps) => {
|
|
29
23
|
const [size, setSize] = useState<Size | null>(null)
|
|
30
24
|
const [pathOrUri, setPathOrUri] = useState<string>('')
|
|
@@ -36,36 +30,22 @@ export const Gif = ({ gifObject, getCachePathMethod, TextComponent }: GifProps)
|
|
|
36
30
|
|
|
37
31
|
useLayoutEffect(() => {
|
|
38
32
|
const loadImageSize = async () => {
|
|
39
|
-
let localPath
|
|
40
|
-
/**
|
|
41
|
-
* Image.queryCache works only for WEB, so we need to use a custom method (Expo Image) for React Native
|
|
42
|
-
*/
|
|
43
|
-
try {
|
|
44
|
-
throw new Error('Image not found in cache')
|
|
33
|
+
let localPath
|
|
45
34
|
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
} else {
|
|
50
|
-
//@ts-ignore
|
|
51
|
-
localPath = await Image.queryCache([gifObject.url]).then(
|
|
52
|
-
(result) => result[gifObject.url],
|
|
53
|
-
)
|
|
54
|
-
}
|
|
55
|
-
if (!localPath) {
|
|
56
|
-
throw new Error('Image not found in cache')
|
|
57
|
-
}
|
|
35
|
+
try {
|
|
36
|
+
// Get image path based on platform (React Native or Web)
|
|
37
|
+
localPath = await getImagePath(gifObject.url, getCachePathMethod)
|
|
58
38
|
} catch (error) {
|
|
59
|
-
|
|
60
|
-
localPath = IS_WEB ? gifFallback :
|
|
39
|
+
// Use fallback if image not found in cache
|
|
40
|
+
localPath = IS_WEB ? gifFallback : Image.resolveAssetSource(gifFallback).uri
|
|
61
41
|
}
|
|
62
|
-
|
|
42
|
+
|
|
43
|
+
// Get and set image dimensions
|
|
63
44
|
Image.getSize(localPath, (width, height) => {
|
|
64
45
|
setSize({
|
|
65
|
-
width:
|
|
66
|
-
height:
|
|
46
|
+
width: constrainDimension(width, MIN_GIF_SIZE, MAX_GIF_SIZE.WIDTH),
|
|
47
|
+
height: constrainDimension(height, MIN_GIF_SIZE, MAX_GIF_SIZE.HEIGHT),
|
|
67
48
|
})
|
|
68
|
-
//@ts-ignore
|
|
69
49
|
setPathOrUri(localPath)
|
|
70
50
|
})
|
|
71
51
|
}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { TranslationKeys } from 'src/shared/translation/types'
|
|
2
2
|
import {
|
|
3
|
+
CustomGetCachePathMethod,
|
|
3
4
|
GifsGroups,
|
|
4
5
|
GifsStructure,
|
|
5
6
|
GroupNumber,
|
|
@@ -103,3 +104,20 @@ export const findGroupForPercentage = (percentage: number) => {
|
|
|
103
104
|
}
|
|
104
105
|
return 'group3'
|
|
105
106
|
}
|
|
107
|
+
|
|
108
|
+
export const getImagePath = async (url: string, cacheMethod?: CustomGetCachePathMethod) => {
|
|
109
|
+
if (cacheMethod) {
|
|
110
|
+
const path = await cacheMethod(url)
|
|
111
|
+
if (path) return path
|
|
112
|
+
} else {
|
|
113
|
+
// @ts-ignore - Image.queryCache works only in web
|
|
114
|
+
const cachedImage = await Image.queryCache([url])
|
|
115
|
+
const path = cachedImage[url]
|
|
116
|
+
if (path) return path
|
|
117
|
+
}
|
|
118
|
+
|
|
119
|
+
throw new Error('Image not found in cache')
|
|
120
|
+
}
|
|
121
|
+
|
|
122
|
+
export const constrainDimension = (value: number, min: number, max: number) =>
|
|
123
|
+
Math.max(min, Math.min(max, value))
|