Closed rmsohaila closed 5 months ago
Hey @rmsohaila, It's difficult for me to pinpoint what's going wrong on your end without a demo example. I've just tried creating a new project on my end:
npx create-expo-app my-app
cd my-app
npx expo install @giphy/react-native-sdk
import { StatusBar } from 'expo-status-bar';
import { StyleSheet, Text, View } from 'react-native';
import React from 'react'
import { SafeAreaView, Button } from 'react-native'
import { GiphyDialog, GiphySDK } from '@giphy/react-native-sdk'
GiphySDK.configure({ apiKey: 'your_key' })
export default function App() { return ( <Button title="Show Giphy Dialog" onPress={() => GiphyDialog.show()} /> ) }
const styles = StyleSheet.create({ container: { flex: 1, backgroundColor: '#fff', alignItems: 'center', justifyContent: 'center', }, });
5. `npx expo prebuild --clean`
6. Open `my-app/android` folder in `Android Studio` and compile
7. `./gradlew generateCodegenArtifactsFromSchema` also works well for me
It's happening the same to me, both for iOS and Android.
I've imported the library just like the documentation says, and only using GiphySDK.configure({ apiKey: "KEY" }), I get this problem:
Hey @DavidStryfe , Could you please attach a demo project here? It seems the issue may be related to incorrect syntax, but I won't be able to assist you in fixing it without the reproducible demo.
Hi @ALexanderLonsky ! Thank you for your answer, I was trying to reproduce it. I see the following error on index.bundle:
var THEME_COLOR_FIELDS = (['avatarPlaceholderColor', 'backgroundColor', 'backgroundColorForLoadingCells', 'confirmationBackButtonColor', 'confirmationSelectButtonColor', 'confirmationSelectButtonTextColor', 'confirmationViewOnGiphyColor', 'defaultTextColor', 'dialogOverlayBackgroundColor', 'emojiDrawerGradientBottomColor', 'emojiDrawerGradientTopColor', 'emojiDrawerSeparatorColor', 'handleBarColor', 'retryButtonBackgroundColor', 'retryButtonTextColor', 'searchBackButtonColor', 'searchBarBackgroundColor', 'searchPlaceholderTextColor', 'searchTextColor', 'stickerBackgroundColor', 'suggestionCellBackgroundColor', 'suggestionCellTextColor', 'tabBarSwitchDefaultColor', 'tabBarSwitchSelectedColor', 'usernameColor'] satisfies (keyof NativeGiphyTheme)[]);
I think this can happens when TypeScript transpiles to javascript, but I don't know why.
Hey @DavidStryfe, What does the error say? For me, if I replace 'satisfies' with 'satisfies1', then I get:
error: SyntaxError: .../node_modules/@giphy/react-native-sdk/src/dto/giphyTheme.ts: Missing semicolon. (91:1)
89 | 'tabBarSwitchSelectedColor',
90 | 'usernameColor',
> 91 | ] satisfies1 (keyof NativeGiphyTheme)[]
| ^
92 |
93 | type ChangeThemeColorType<T> = {
94 | [P in keyof T]: P extends (typeof THEME_COLOR_FIELDS)[number] ? ColorValue : T[P]
What you can try is to go to /node_modules/@giphy/react-native-sdk/src/dto/giphyTheme.ts
and replace
const THEME_COLOR_FIELDS = [
'avatarPlaceholderColor',
'backgroundColor',
'backgroundColorForLoadingCells',
'confirmationBackButtonColor',
'confirmationSelectButtonColor',
'confirmationSelectButtonTextColor',
'confirmationViewOnGiphyColor',
'defaultTextColor',
'dialogOverlayBackgroundColor',
'emojiDrawerGradientBottomColor',
'emojiDrawerGradientTopColor',
'emojiDrawerSeparatorColor',
'handleBarColor',
'retryButtonBackgroundColor',
'retryButtonTextColor',
'searchBackButtonColor',
'searchBarBackgroundColor',
'searchPlaceholderTextColor',
'searchTextColor',
'stickerBackgroundColor',
'suggestionCellBackgroundColor',
'suggestionCellTextColor',
'tabBarSwitchDefaultColor',
'tabBarSwitchSelectedColor',
'usernameColor',
] satisfies (keyof NativeGiphyTheme)[]
with
const THEME_COLOR_FIELDS: (keyof NativeGiphyTheme)[] = [
'avatarPlaceholderColor',
'backgroundColor',
'backgroundColorForLoadingCells',
'confirmationBackButtonColor',
'confirmationSelectButtonColor',
'confirmationSelectButtonTextColor',
'confirmationViewOnGiphyColor',
'defaultTextColor',
'dialogOverlayBackgroundColor',
'emojiDrawerGradientBottomColor',
'emojiDrawerGradientTopColor',
'emojiDrawerSeparatorColor',
'handleBarColor',
'retryButtonBackgroundColor',
'retryButtonTextColor',
'searchBackButtonColor',
'searchBarBackgroundColor',
'searchPlaceholderTextColor',
'searchTextColor',
'stickerBackgroundColor',
'suggestionCellBackgroundColor',
'suggestionCellTextColor',
'tabBarSwitchDefaultColor',
'tabBarSwitchSelectedColor',
'usernameColor',
];
It should help if the problem is related to the 'satisfies' keyword.
P.S. What version of Expo or TypeScript are you using?
Hello 👋, this issue has been open for more than a month without a repro or any activity. If the issue is still present in the latest version, please provide a repro or leave a comment within 7 days to keep it open, otherwise it will be closed automatically. If you found a solution or workaround for the issue, please comment here for others to find. If this issue is critical for you, please consider sending a pull request to fix it.
Hi, I am a beginner to the App Development therefore I chose Expo in the start to kick start with project. Now when I came across to integrate the GiphyDialog in my app, I've ejected my app from expo using![image](https://github.com/Giphy/giphy-react-native-sdk/assets/7343429/af855cfd-7fed-43be-ba0c-4484824a22e6)
npx expo prebuild
. After that I've started with the initial example given in the repo and unable to run the App.After run into this exception when I tried to follow the command given in the documentation![image](https://github.com/Giphy/giphy-react-native-sdk/assets/7343429/6bad9f4b-90ec-4826-a515-bdcbac19a3b3)
I am getting following error:
I've tried by updating the![image](https://github.com/Giphy/giphy-react-native-sdk/assets/7343429/7622c53b-8aaf-48ae-ba5e-09deb81db62b)
maven
tomaven-publish
but the problem persist.My Env versions:![image](https://github.com/Giphy/giphy-react-native-sdk/assets/7343429/ce8b92a4-fd9f-416e-9657-d8d4d7176930)
Please help me integrate the GiphySDK. Thanks