custom route for <Resource> component - admin-on-rest

I like to create a new custom route for user resource, like /:id/passreset maps to the passreset component, similar to /user/:id/delete
This /passreset will open up a dialog like /delete and ask for the confirmation.
What I did:
Add customRoutes:
<Route exact path="/users/:id/passreset" component={ActionChangePassword} />
Create new button with:
containerElement={<Link to={`${linkToRecord(basePath, record.id)}/passreset`} />}
Create a new action and copy content from admin-on-rest\src\mui\delete\Delete.js
However, it is not working properly. Keep getting an error below. Please advise.
Thanks!
TypeError: Cannot read property 'data' of undefined
Function.mapStateToProps [as mapToProps]
src/actionPassReset.js:123
120 | function mapStateToProps(state, props) {
121 | return {
122 | id: decodeURIComponent(props.match.params.id),
> 123 | data: state.admin[props.resource].data[decodeURIComponent(props.match.params.id)] ,
124 | isLoading: state.admin.loading > 0,
125 | };
126 | }

That's because the state has been reorganized in 1.3.0. We should have released a new major version with documented breaking changes.
New state is state.admin.resources[props.resource].data

Related

Not work TransitionPresets. react-navigation version 6

I recently upgraded from v4 to v6.
As a result, TransitionPresets seems to have stopped working.
<Stack.Screen
name="Home"
component={Home}
options={{ ...TransitionPresets.ModalSlideFromBottomIOS }}
/>
I don't think there is any wrong way to use it.
https://reactnavigation.org/docs/stack-navigator/#transitionpresets
Has anyone else encountered a similar problem?
Edit 2021-11-17
I'm sorry.
I guess I did not understand the difference between native stack and stack.
I used the normal stack and it worked.
I got the same problem, when switching versions and editing a way of writing Stack I noticed that they redirected to different libs.
Change from:
import { createNativeStackNavigator, TransitionPresets } from '#react-navigation/native-stack';
For:
import { createStackNavigator, TransitionPresets, } from '#react-navigation/stack';
And also edited when creating the Stack of:
const Stack = createNativeStackNavigator();
For:
const Stack = createStackNavigator();
In navigation v6
<Stack.Navigator
screenOptions={{
animation: 'fade_from_bottom',
}}>
</Stack.Navigator>
animation options should be :
StackAnimationTypes = 'default' | 'fade' | 'fade_from_bottom' | 'flip' | 'none' | 'simple_push' | 'slide_from_bottom' | 'slide_from_right' | 'slide_from_left'
You need to add TransitionPresets in screenOptions props in Stack.Navigator. Just put same as follows.
<Stack.Navigator screenOptions={{...TransitionPresets.SlideFromRightIOS}}>
<Stack.Screen name="screenName" component={screenComponent} />
</Stack.Navigator>

How to solve Laravel sslcommerze integration error?

I've done all the settings for demo payment gateway with sslcommerze, as per the below link.
https://www.youtube.com/watch?v=cdGZLO0-76E
https://github.com/sslcommerz/SSLCommerz-Laravel
But I've an error after pressing Pay Now Button. "Error in Communication"
https://prnt.sc/tx321e
The Pop up appears but does not show select bank option. Hpw can I fix this?
Create a sandbox account from:
[[https://developer.sslcommerz.com/registration/]]
You can put any dummy data for registration, except your email address.
[Note: Email address should be valid. You will receive a email verification code through your email. Put the information that you will remember].
Click here to login to the merchant panel:
[[https://sandbox.sslcommerz.com/manage/]]
Login ID: "That you have given during the registration"
Password: "That you have given during the registration"
[Note: Now you will get an email containing with STORE_ID and STORE_PASSWORD, it might take a couple of seconds]
Go to .env file from your laravel project:
Add those following lines at the end of the file:
STORE_ID = That you received from the mail
STORE_PASSWORD = That you received from the mail
Set your database name, username, and password at the same time.
Download the SslCommerz zip file or clone in any folder:
[[https://github.com/sslcommerz/SSLCommerz-Laravel]]
The file folder structure look like this,
|-- config/
|-- sslcommerz.php
|-- app/Library/SslCommerz
|-- AbstractSslCommerz.php (core file)
|-- SslCommerzInterface.php (core file)
|-- SslCommerzNotification.php (core file)
|-- README.md
|-- orders.sql (sample)
Now follow the steps to integrate payment gateway to integrate to your paypal project:
Step 1: Extract the file
Step 2: Copy the Library folder and put it in the laravel project's app/ directory. If needed, then run composer dump - o.
Step 3: Copy the config/sslcommerz.php file into your laravel project's config/ folder.
Step 4: Copy the SslCommerzPaymentController into your laravel project's Controllers folder
Step 5: Copy the defined routes from routes/web.php into your laravel project's route file.
Step 6: Add the below routes into the $excepts array of VerifyCsrfToken middleware.
protected $except = [
'/pay-via-ajax', '/success','/cancel','/fail','/ipn'
];
Step 7: Copy all the view files under the resource folder and paste into your laravel project's resources/views/ folder.
Step 8: To integrate popup checkout, use the below script before the end of body tag. Add it in any blade template that you want add your button.
For Example: welcome.blade.php-> paste the code below, before ending of the body tag.
For Sandbox:
<script>
(function (window, document) {
var loader = function () {
var script = document.createElement("script"), tag = document.getElementsByTagName("script")[0];
script.src = "https://sandbox.sslcommerz.com/embed.min.js?" + Math.random().toString(36).substring(7);
tag.parentNode.insertBefore(script, tag);
};
window.addEventListener ? window.addEventListener("load", loader, false) : window.attachEvent("onload", loader);
})(window, document);
</script>
For Live:
<script>
(function (window, document) {
var loader = function () {
var script = document.createElement("script"), tag = document.getElementsByTagName("script")[0];
script.src = "https://seamless-epay.sslcommerz.com/embed.min.js?" + Math.random().toString(36).substring(7);
tag.parentNode.insertBefore(script, tag);
};
window.addEventListener ? window.addEventListener("load", loader, false) : window.attachEvent("onload", loader);
})(window, document);
</script>
Step 9: Use the below button where you want to show the "Pay Now" button:
Should be in the same place where step 8 was implemented.
Pay Now
There is a orders.sql file in the SslCommerz folder. You can import it directrly from the phpmyadmin. Or you make a migration and model manually. And create new table according to the oraders.sql file columns.
You're done!
Some problem you might face.
Possible solution:-
-> Check DB class in the SslCommerzPaymentController and change, use DB into Illuminate\Support\Facades\DB;
-> Import SslCommerzPaymentController from the web.php.
-> Migrate the table.
-> Add this line of code to the payViaAjax method in the SslCommerzPaymentController, if you want to retrieve data dynamically from the form
public function payViaAjax(Request $request, $id)
{
<<$requestData = (array)json_decode($request->cart_json);>>
Copy and put 4 key-value pairs to your .env file from below.
SSLCZ_STORE_ID=<your store id>
SSLCZ_STORE_PASSWORD=<your store password>
SSLCZ_TESTMODE=true
IS_LOCALHOST=true

React Router Switch Redux Dispatch

I have the below switch statement that routes the user to correct component based on the link they are on.
const Router = (props) => {
switch(props.page) {
case 'Equities' :
this.props.pageName('Equities');
this.props.pageURL('/Equities');
return <Equities />;
case 'Daily' :
return <Daily />;
default :
return ( <Redirect to="/Equities" /> )
}
}
const content = ({ match }) => {
return (
<div className="content">
<Router page={match.params.type} />
</div>
);
}
const mapDispatchToProps = {
pageURL,
pageName
};
export default connect(mapDispatchToProps)(content);
On the 4th line above, I am trying to dispatch an action to Redux to update page name and URL in the redux store that the user is on. I get the below error:
How can I dispatch actions based on the page user is on so I update name and URL to whichever page user is visiting?
So, for anyone experiencing this problem, it seems to be caused by my error on adding redux to the page crashing with the compose module.
My component structure for the app is like this:
App -> Skeleton -> TopBar, Sidebar, Content
So inside Content component I have a switch that displays the correct content for user. I was trying to add this functionality to Content. Now I added to Skeleton, and it works fine and is much better because I don't need to add now 8 different statements inside switch saying if match this do this do that. Now all I have is this.props.pageName(match.url); this.props.pageURL(match.params.type); so I record in redux the user is on and that's all.

How to pass javascript variable from laravel controller to vuejs component

I'm trying to build a page on Laravel 5.4 which contains few data which needs to be manipulated and then sent across the views. My view contains components of the vuejs v2.0. I want those data to be implemented in the components. I tried using the laracasts PHP Vars to JS transformer but unable to get it. I followed the steps by placing "laracasts/utilities": "~2.0" in my composer.json then I added the serviceprovider as mentioned in the documentation, I published the vendor and added the following in config/javascript.php,
'bind_js_vars_to_this_view' => 'Nitseditor.show',
I'm having a dynamic views folder which is currently inside my Nitseditor\home\resources\views Now in my controller I'm having following codes:
public function show()
{
JavaScript::put([
'foo' => 'bar',
'age' => 29
]);
return view(Nitseditor.show);
}
Now first of all it was throwing an error as I see that it was including use MongoDB\BSON\Javascript; then I removed and tried using use JavaScript
Now in the app.js file which is present in my asset folder, I'm including each components and trying to do console.log(foo); but its throwing an error foo not defined.
There are a few ways to do this depending on what you are trying to achieve and how your project is set up. The simplest way is to make a request to your controller from inside your component that returns json. Laravel 5.4 comes with axios so you can use that:
methods: {
getData(){
axios.get('/controller/route')
.then(response => {
// set your variables from the response
this.myData = response.data;
})
.catch(error => {
console.log(error);
});
},
data(){
return {
myData: {}
}
}
If you need child components to access the data then you would need to put that in the parent and pass myData" using props.
You could also create a directive and pass your variable down directly from your blade template:
Vue.directive('init', {
bind: function(el, binding, vnode) {
vnode.context[binding.arg] = binding.value;
}
});
Then you would just need to do:
<div v-init:vars="{foo: 'foo', age: 29}"></div>
And pass vars as props to any component that needs them:
Here's the JSFiddle: https://jsfiddle.net/3e05qwLh/
If you have multiple descendants that rely on your variables you will probably want to look at using vuex.
Dunno if it helps but I use this method for passing variables to javascript:
// in master layout (head section)
<meta name="foo" content="{{ $foo }}">
// in javascript (included or in the template)
foo = $('meta[name=foo]').attr('content');
If you have javascript in the blade template you can use directly this method:
foo = "{{ $foo }}";

Laravel -weird output at top of every page and command

I tried to get an answer from the laracast community but ended up not getting a response. I get the following text output at the top of every page or CLI command:
Skip to content Personal Open source Business Explore Pricing Blog Support This repository
3,019 22,483
7,384
laravel/laravel Code Pull requests 0 Pulse Graphs
laravel/config/database.php eb7743f 11 days ago #dakira dakira allow
for setting sqlite database via env #taylorotwell #TGM #vlakoff
#dakira #marcanuy #pedes42 #jimmypuckett #GrahamCampbell
#david-ridgeonnet #SyntaxC4 #overtrue 121 lines (101 sloc) 3.84 KB
All of the files that may be suspect are available in the laracast discussion I posted.
C4 #overtrue
121 lines (101 sloc) 3.84 KB
BTW I used composer to install laravel.
EDIT routes.php file
<?php
/*
|--------------------------------------------------------------------------
| Application Routes
|--------------------------------------------------------------------------
|
| Here is where you can register all of the routes for an application.
| It's a breeze. Simply tell Laravel the URIs it should respond to
| and give it the controller to call when that URI is requested.
|
*/
Route::get('/', 'PagesController#index');
Route::get('item', 'ItemController#index');
Route::get('item/create', 'ItemController#create');
Route::get('item/{id}', 'ItemController#show');
Route::get('welcome', function() {
return view('welcome');
});
Route::group(['middleware' => 'web'], function () {
Route::auth();
Route::get('/home', 'HomeController#index');
});
Route::post('item', 'ItemsController#Store');

Resources